SVGTransformList: replaceItem() Methode
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Die replaceItem()
-Methode der SVGTransformList
-Schnittstelle ersetzt ein bestehendes Element in der Liste mit einem neuen Element.
Das eingefügte Element ist das Element selbst und nicht eine Kopie.
-
Wenn
newItem
bereits in einer Liste enthalten ist, wird es aus seiner vorherigen Liste entfernt, bevor es in diese Liste eingefügt wird. -
Wenn das Element bereits in dieser Liste ist, beachten Sie, dass der
index
des zu ersetzenden Elements vor dem Entfernen des Elements liegt.
Syntax
replaceItem(newItem, index)
Parameter
newItem
-
Ein
SVGTransform
-Element, das in die Liste eingefügt wird. index
-
Ein
integer
; der Index, an dem das neue Element das bestehende ersetzen soll, als unsignierte lange Zahl.
Rückgabewert
Ein SVGTransform
-Objekt; das eingefügte Element aus der Liste.
Ausnahmen
Diese Methode kann eine DOMException
einer der folgenden Typen auslösen:
NoModificationAllowedError
DOMException
-
Wird ausgelöst, wenn
SVGTransformList
einem schreibgeschützten Attribut entspricht oder wenn das Objekt selbst schreibgeschützt ist. IndexSizeError
DOMException
-
Wird ausgelöst, wenn die Indexnummer größer oder gleich
numberOfItems
ist.
Beispiele
Ersetzen einer Transformation in der Liste
<svg width="200" height="200" id="mySvg">
<rect width="100" height="100" fill="blue" transform="translate(50,50)" />
</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 rotation transformation
const rotateTransform = svgElement.createSVGTransform();
rotateTransform.setRotate(45, 50, 50);
transformList.replaceItem(rotateTransform, 0);
// Log the details of the new transformation
console.log(`New Transformation Type: ${transformList.getItem(0).type}`); // Output: 4 (e.g. SVG_TRANSFORM_ROTATE)
Spezifikationen
Specification |
---|
Scalable Vector Graphics (SVG) 2 # __svg__SVGNameList__replaceItem |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
replaceItem |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support