在JS中添加元素

add element after in JS

本文关键字：元素 添加 JS      更新时间：2023-09-26

如何在javascript元素前后添加元素(在我的例子中是"br tag "):

换句话说，我需要与以下内容等价的内容，但是在javascript中:

$('<br />').insertBefore('#id1');
$('<br />').insertAfter('#id1');

JSfiddle

应该是直接的，insertBefore在原生JS中也是可用的，所以在元素之前插入一个BR标签，然后获得下一个兄弟元素并在此之前插入一个BR，这也将在目标元素之后:

var elem = document.getElementById('id1');
var br   = document.createElement('br');
elem.parentNode.insertBefore(br.cloneNode(false), elem);
elem.parentNode.insertBefore(br.cloneNode(false), elem.nextSibling);

小提琴

核对答案

var parentGuest = document.getElementById("one");
var childGuest = document.createElement("br");
parentGuest.parentNode.insertBefore(childGuest,parentGuest);
parentGuest.parentNode.insertBefore(childGuest,parentGuest.nextSibling);

(JSFIDDLE) 

<html>
<body>
<div id="a"><div id="a1">Coffee</div><div id="a2">Tea</div></div><br/><br/>
<div id="b"><div id="b1">Mother</div><div id="b2">Father</div></div>

<button onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
//insertBefore
var newItem1=document.createElement("hr");
var parent1=document.getElementById("a");
var child1=document.getElementById("a2");
parent1.insertBefore(newItem1,child1);
//insertAfter There is no insert Atfter Method in Java Script


}
</script>
</body>
</html>
相关文章：