ドキュメントに挿入する前に、新しく作成したDOMオブジェクトでgetElementByIdを使用します。

Question

getElementByIdメソッドは、DOM要素がドキュメントに添付されていない限り使用できません。 DOM要素がドキュメントに添付される前に、どのメソッドやメカニズムを使用してDOM要素にアクセスして変更できますか？

私は大きなDOM要素を持っており、その一部にアクセスしたいと思います。私は古典的にはgetElementByIdを使用しますが、DOM要素はドキュメントには添付されません。

var element = document.createElement("div"); 
element.id = 'testqq'; 
var el = document.getElementById('testqq'); // el will be null! 

ソース：https://developer.mozilla.org/en/dom/document.getelementbyid

私はjQueryのを使用していない答えを探しています。私はjQueryが大好きですが、私の現在の問題の選択肢ではありません。

Answer 1

まあ、すでにelementという変数で参照しています。

しかし、私はあなたが内部に何かを入れたいと思うことを意味するでしょう。そうだとすれば、getElementsByTagName('*')を使用し、返されたコレクションを反復処理し、自分のIDプロパティが見つかるまでIDプロパティをテストします。

var div = document.createElement('div'); 

div.innerHTML = '<p>yo</p><div><span id="tester">hi</span></div>'; 

var all = div.getElementsByTagName('*'); 

    // search for element where ID is "tester" 
for (var i = 0, len = all.length; i < len; i++) { 
    if (all[i].id === 'tester') { 
     var result = all[i]; 
     break; 
    } 
} 

alert(result.id); 

あなたがループを試す前に、あなたはquerySelectorAllブラウザでサポートされているかどうかをテストし、もしそうすることを使用することができます。

if(div.querySelectorAll) { 
    var result = div.querySelectorAll('#tester'); 
} else { 
    // Do the loop with getElementsByTagName() 
} 

Answer 2

document.createElement関数は、新しい要素オブジェクトを返しますが、あなたはそれ挿入するまで、その要素はDOM に存在しません。

ドキュメントオブジェクトには、作成を依頼した要素が記憶されていないので、document.getElementById('testqq')を呼び出すと、探しているものはまったく分かりません。

あなたの例では、にはという要素が既にあります。なぜあなたはその文書を要求する必要がありますか？