SVGTransformList: insertItemBefore() 方法
SVGTransformList 接口的 insertItemBefore() 方法会在指定位置将新项插入到列表中。
第一个项的索引为 0。插入的项是该项本身，而不是副本。
-
如果
newItem已经存在于某个列表中，在将其插入到此列表之前，会先将其从之前的列表中移除。 -
如果该项已在此列表中，请注意，要插入到其之前的项的
index在该项被移除之前就已经确定了。 -
如果
index等于0，则新项将插入到列表的开头。 -
如果
index大于或等于numberOfItems，则新项将被添加到列表的末尾。
语法
js
insertItemBefore(newItem, index)
参数
newItem-
要插入到列表中的一个
SVGTransform项。 index-
一个
integer；新项应插入的位置，作为一个无符号长整型。
返回值
一个 SVGTransform 对象；从列表中插入的项。
异常
NoModificationAllowedErrorDOMException-
如果
SVGTransformList对应于只读属性，或者对象本身是只读的，则会抛出此异常。
示例
在列表中插入变换
html
<svg width="200" height="200" id="mySvg">
<rect width="100" height="100" fill="blue" />
</svg>
js
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 translate transformation
const translateTransform = svgElement.createSVGTransform();
translateTransform.setTranslate(50, 50);
// Insert the translation transformation at the beginning of the list
transformList.insertItemBefore(translateTransform, 0);
// The transformation list length and type
console.log(`Number of transformations: ${transformList.length}`); // Output: 1
console.log(`Transformation Type: ${transformList.getItem(0).type}`); // Output: 2 (e.g. SVG_TRANSFORM_TRANSLATE)
规范
| 规范 |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGNameList__insertItemBefore |
浏览器兼容性
加载中…