2016-09-28 11 views
-2

XMLから情報を動的に追加してdivに追加しようとしています。JS「ノード」で「appendChild」を実行できませんでした。パラメータ1のタイプが「ノード」ではありません

:私の考えはsideTabはそのような何かを持っています

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

(必須ではありません..私はまた、実際に、既存のdivに追加することができます)、既存のdivの内側に新しいdiv要素を追加するJSです

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

既存のdiv

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

しかし、私はこのエラーを受け取ります: 'ノード'で 'appendChild'を実行できませんでした:パラメータ1のタイプが 'ノード'ではありません。

+3

? – brk

+2

は、 'sideTab'変数にあるものは、' Node'型ではないように見えます。エラーメッセージの内容と同じです。 – keymone

+0

投機: 'sideTab'の値は文字列(HTMLの)です – Quentin

答えて

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> 

は、文字列要素で動作するように修正しました。あなたは `sideTab`を定義している

Plunker has been fixed.

+1

OPは、コメントで、 'sideTab'は文字列であり、' null'ではないことを明らかにしました。 – Quentin

+0

固定しました。 OPがコメントで明らかになったときには、downvoteしないでください。私が解決策を作成していたとき、私はそれを見たことがありませんでした。 – AMagyar

+0

私はまだ同じエラーが発生します。 "node"に 'appendChild'を実行できませんでした:パラメータ1のタイプが 'Node'ではありません – Joseph

関連する問題