2016-12-21 8 views
0

EDIT新しく作成されたHTML要素にIDを割り当てる方法を教えてください。 NetBeansでこのコードを使用 :

TypeError: undefined is not a function (evaluating  'document.querySelector("body").append(ele)') (13:47:52:032 | error, javascript) 
at global code (public_html/index.html:34:42) 

appendingnull前(13:47:52:036)

このコード:

var ele = document.createElement("div"); 
ele.id = 'tempId1'; 
ele.innerHTML = "TEST"; 
document.querySelector("body").append(ele); 
document.getElementById("tempId1").innerHTML= "TEST2"; 

は私にエラーを与えます

var newElement = document.createElement("DIV"); 
newElement.setAttribute("id", "uniqueIdentifier"); 
console.log("before appending" + document.getElementById("uniqueIdentifier")); 
document.body.append(newElement); 
console.log("after appending" + document.getElementById("uniqueIdentifier")); 
document.getElementById("uniqueIdentifier").innerHTML = "hello"; 

エラー:

TypeError: undefined is not a function (evaluating 'document.body.append(newElement)') (13:47:52:037 | error, javascript) 
at global code (public_html/index.html:51:21) 

コードはChromeで正常に実行されますが、NetBeans Embedded Webkit Browserでは実行されないようです。私は今、他に何か問題があるのだろうかと思っていますが、少なくとも私はそれを機能させることができます。皆さんありがとう。


元のテキスト: (私はプログラミングに非常に悪いです。)

私はそれに新しいIDを割り当て、新しいHTML要素を作成しようとし、そのIDと出力何かを呼び出しています.innerHTMLを使用して文字列を挿入します。

私は

var newElement = document.createElement("DIV"); 

を使用して、いずれかの場合:

document.newElement.id = "newId"; 

OR:その後、

newElement.setAttribute("id", "uniqueIdentifier"); 

と新しい要素を使用していることを、テキストと出力を割り当てよう:

document.getElementById("uniqueIdentifier").innerHTML = "TEST OUTPUT"; 

何も起こりません。

多くの設定を試しましたが、新しいIDを使って何も出力することはできません。

私は、人々が新しく生成されたオブジェクトにIDを割り当てるコードをコピーして貼り付けましたが、新しいIDを使って何も出力することはできません。私は、追加の行を追加した。これに

var ele = document.createElement('div'); 
var id = 'temp1'; 
ele.setAttribute('id', id); 

:出力何にも失敗した

document.getElementById("temp1").innerHTML = "TEST"; 

は、ここで私がコピーされた何かの例です。

私が試したコードの別の例は:

var el = document.createElement('div'), 
staticPart = 'myUniqeId', 
i = 0; 
el.id = staticPart + i; 
el.getAttribute('id'); 
el.id; 

は、私は再び動作しません

document.getElementById("myUniqeId0").innerHTML = "OUTPUT TEST"; 

を追加するには。私は数日間立ち往生した。前もって感謝します。

+0

私はあなたがここに欠けている部分がDOMに新しく作成された要素を追加していると思います。新しい要素を作成しましたが、DOMの任意の位置に配置していません。新しい要素をDOMに追加するには ' .append(yourNewElement)'を呼び出す必要があります。以下の回答を参照してください。 –

答えて

0

を使用すると、要素の内部htmlを直接設定できます。

ele.id = 'temp1'; 
    ele.innerHTML = "TEST"; 

あなたのページの出力を確認するには、この要素をHTMLの既存の要素に追加する必要があります。ここではhtml本文に追加されています。 element.youを作成した後

var ele = document.createElement('div'); 
 
ele.id = 'temp1'; 
 
ele.innerHTML = "TEST"; 
 
document.querySelector("body").append(ele);

0

は、setAttributeメソッドを使用してIDを設定し、体にそれを追加して、あなたはそれを追加していない場合はその内容

を設定してみてくださいbodyとdocument.getElementById( "uniqueIdentifier")としてdomを検索しようとするとnullが返されるため、コンテンツが表示されない理由です。

このスニペットを確認

var newElement = document.createElement("DIV"); 
 

 

 
newElement.setAttribute("id", "uniqueIdentifier"); 
 

 
console.log("before appending" + document.getElementById("uniqueIdentifier")); 
 

 

 

 
document.body.append(newElement); 
 

 
console.log("after appending" + document.getElementById("uniqueIdentifier")); 
 

 
document.getElementById("uniqueIdentifier").innerHTML = "hello";

これはあなたがその要素は文書の一部であるだけで後document.getElementById機能を使用することができます

0

お役に立てば幸いです。作成した要素をドキュメントの要素の1つに追加しない限り、getはできません。

0

これはコードの3行で行うことができます!

$('body').html('<div></div>'); 
 
$('div').attr('id', 'test'); 
 
$('div#test').html("<h1>Hello World</h1>")
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

関連する問題