Baseline Widely available
The appendItem()
method of the SVGTransformList
interface inserts a new item at the end of the list.
The inserted item is the item itself and not a copy.
newItem
is already in a list, it is removed from its previous list before it is inserted into this list.newItem
An SVGTransform
item that is appended to the list.
An SVGTransform
object; the appended item from the list.
NoModificationAllowedError
DOMException
Thrown if SVGTransformList
corresponds to a read-only attribute or when the object itself is read-only.
<svg width="200" height="200">
<rect width="100" height="100" fill="red" />
</svg>
const svgElement = document.querySelector("svg");
const rectElement = svgElement.querySelector("rect");
// Access the transform list of the <rect> element
const transformList = rectElement.transform.baseVal;
// Create a new translation transformation
const svgTransform = svgElement.createSVGTransform();
svgTransform.setTranslate(50, 50);
// Append the new transformation to the list
const appendedTransform = transformList.appendItem(svgTransform);
console.dir(appendedTransform); // Output: SVGTransform { type: 2, matrix: SVGMatrix, angle: 0 }
console.log(`Total number of transformations: ${transformList.numberOfItems}`); // Output: 1
Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4