我想使用javascript将安莉元素附加到ul元素中的另一个li后面,这就是我到目前为止所用的代码。
var parentGuest = document.getElementById("one");
var childGuest = document.createElement("li");
childGuest.id = "two";
我很熟悉appendChild,
parentGuest.appendChild(childGuest);
但是,这会将新元素附加到另一个元素中,而不是添加到之后。如何将新元素追加到现有元素之后?谢谢。
<ul>
<li id="one"><!-- where the new li is being put --></li>
<!-- where I want the new li -->
</ul>
发布于 2011-08-31 22:12:33
在元素的下一个同级元素之前,您需要将新元素追加到现有元素的父级。像这样:
var parentGuest = document.getElementById("one");
var childGuest = document.createElement("li");
childGuest.id = "two";
parentGuest.parentNode.insertBefore(childGuest, parentGuest.nextSibling);
或者,如果您只想添加它,那么:
var parentGuest = document.getElementById("one");
var childGuest = document.createElement("li");
childGuest.id = "two";
parentGuest.parentNode.appendChild(childGuest);
发布于 2011-08-31 23:07:15
这就足够了:
parentGuest.parentNode.insertBefore(childGuest, parentGuest.nextSibling || null);
因为如果refnode
(第二个参数)为null,则执行常规的appendChild。查看此处:http://reference.sitepoint.com/javascript/Node/insertBefore
实际上我怀疑|| null
是否是必需的,试一试看看。
发布于 2015-11-19 23:31:53
你也可以这样做
function insertAfter(node1, node2) {
node1.outerHTML += node2.outerHTML;
}
或
function insertAfter2(node1, node2) {
var wrap = document.createElement("div");
wrap.appendChild(node2.cloneNode(true));
var node2Html = wrap.innerHTML;
node1.insertAdjacentHTML('afterend', node2Html);
}
https://stackoverflow.com/questions/7258185
复制相似问题