在JavaScript中的指定位置插入指定元素?
Javascript 提供了“insertAdjacentElement()”以在指定位置插入现有元素。如果有多个具有相同名称的元素,则在访问数组元素时使用索引来访问它们。
语法
node.insertAdjacentHTML(position, element);
示例1
在以下示例中,实际上在并行span1,span2和header中有3个元素。使用方法insertAdjacentElement(),我们将元素span1放置在标题下方,如输出所示。
<html>
<body>
<span>My span1</span>
<span>My span2</span>
<h2 id="H2">My Header</h2>
<script>
var s = document.getElementsByTagName("span")[0];
var h = document.getElementById("H2");
h.insertAdjacentElement("afterend", s);
</script>
</body>
</html>输出结果
My span2 My Header My span1
示例2
在以下示例中,实际上在并行span1,span2和header中有 3个元素。使用方法insertAdjacentElement(),我们将元素span2放置在标题下方,如输出所示。如果有多个元素,则通过索引访问像数组一样的元素。
<html>
<body>
<span>My span1</span>
<span>My span2</span>
<h2 id="H2">My Header</h2>
<script>
var s = document.getElementsByTagName("span")[1];
var h = document.getElementById("H2");
h.insertAdjacentElement("afterend", s);
</script>
</body>
</html>输出结果
My span1 My Header My span2