Question

我正在尝试从XML添加动态信息并添加到div。我的想法是在现有的div中添加新的div（不是强制性的..我也可以实际添加到现有的div）

JS

    var newDiv = document.createElement("div");  //new Div
    newDiv.appendChild(sideTab);
    var existingDiv = document.getElementById("vertical");  //Existing div
    document.body.insertBefore(newDiv,existingDiv);

sideTab会有类似的东西：

 <ul class ="tab" >
     <li><a href="#" class="tab"> Something</a></li>
 </ul>

现有div

    <div class="left" id="vertical">

但是当我执行时我得到这个错误：无法在'Node'上执行'appendChild'：参数1不是'Node'类型。

Answer 1

将字符串解析为DOM并将所需元素添加到HTML中。

<!DOCTYPE html>
<html>

<head>
<script>
window.onload = function() {
    var newDiv = document.createElement("div"); //new Div
    var parser = new DOMParser();
    var el = parser.parseFromString(`<ul id="sideBar"><li><a>Something</a></li></ul>`, "text/html");
    var element = el.getElementById("sideBar");
    newDiv.appendChild(element);
    var existingDiv = document.getElementById("vertical"); //Existing div
    document.body.insertBefore(newDiv, existingDiv);
}
</script>
</head>

<body>
    <div class="left" id="vertical"></div>
</body>

</html>

修复了使用字符串元素的问题。

Plunker has been fixed.

JS无法在'Node'上执行'appendChild'：参数1不是'Node'类型

1 个答案: