在JavaScript中有insertBefore(),但如何在不使用jQuery或其他库的情况下在另一个元素之后插入一个元素?
当前回答
我使用以下命令在选择的末尾插入选项。通过传递null作为第二个参数。我不确定这是否是一个异常的“选择”元素,因为我从来没有尝试过其他任何东西,但如果有人来这里寻找这个可能会有所帮助。在IE上也能工作(令人惊讶)。:)
var x = document.getElementById("SELECT_LIST");
var boption = document.createElement("option");
boption.text = "SOME TEXT";
boption.value = "SOME VALUE";
x.insertBefore(boption, null);
其他回答
方法节点。After (doc)在另一个节点之后插入一个节点。
对于两个DOM节点node1和node2,
node1.after(node2)在node1之后插入node2。
这个方法在旧的浏览器中是不可用的,所以通常需要填充。
我使用以下命令在选择的末尾插入选项。通过传递null作为第二个参数。我不确定这是否是一个异常的“选择”元素,因为我从来没有尝试过其他任何东西,但如果有人来这里寻找这个可能会有所帮助。在IE上也能工作(令人惊讶)。:)
var x = document.getElementById("SELECT_LIST");
var boption = document.createElement("option");
boption.text = "SOME TEXT";
boption.value = "SOME VALUE";
x.insertBefore(boption, null);
referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
这里的referenceNode是你想把newNode放在后面的节点。如果referenceNode是它的父元素中的最后一个子元素,那很好,因为referenceNode。nextSibling将为null, insertBefore通过添加到列表末尾来处理这种情况。
So:
function insertAfter(referenceNode, newNode) {
referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}
你可以使用下面的代码段来测试它:
函数插入之后(引用节点, 新节点) { referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); } var el = document.createElement(“span”); el.innerHTML = “test”; var div = document.getElementById(“foo”); insertAfter(div, el); <div id=“foo”>你好</div>
步骤1。准备要素:
var element = document.getElementById('ElementToAppendAfter');
var newElement = document.createElement('div');
var elementParent = element.parentNode;
步骤2。在后面追加:
elementParent.insertBefore(newElement, element.nextSibling);
快速搜索谷歌会显示这个脚本
// create function, it expects 2 values.
function insertAfter(newElement,targetElement) {
// target is what you want it to go after. Look for this elements parent.
var parent = targetElement.parentNode;
// if the parents lastchild is the targetElement...
if (parent.lastChild == targetElement) {
// add the newElement after the target element.
parent.appendChild(newElement);
} else {
// else the target has siblings, insert the new element between the target and it's next sibling.
parent.insertBefore(newElement, targetElement.nextSibling);
}
}