改行後にtextNodeを作成しないでください。

Question

は私が手動でHTMLファイル内にそれらの次の行を記述する場合：

<div> 
<input type="button" value="Button 1"> 
<input type="button" value="Button 2"> 
</div> 

テキストノードは、それぞれの新しい行のために作成されます。

addEventListenerメソッドのuseCapture引数を理解したかったと思います。 div要素のchildNodesプロパティを使用してDOM要素にアクセスすることを選択しましたが、要素間のtextNodesを無視する必要があります。これは本当に実用的ではありません：あなたは、私は私の2個の入力タグを選択するためにchildNodes[0]とchildNodes[2]を無視しなければならないことがわかりここ

document.getElementsByTagName("div")[0].addEventListener("click", function(){alert(1);}, true); 

document.getElementsByTagName("div")[0].childNodes[1].addEventListener("click", function(){alert(2);}, false); 

document.getElementsByTagName("div")[0].childNodes[3].addEventListener("click", function(){alert(3);}, false); 

。

JavaScriptコードcreateElementを使わずに、すべてのHTMLコードを1行に書き込むことなく、textNodesの作成をバイパスする方法はありますか？

改行するときにtextNodesを作成せずにHTMLコードを記述することはできますか？

Answer 1

まず、は自分自身を繰り返さない！同じDOMクエリを何度も繰り返しています。

はこれを試してみてください：ボタンを取得するにはgetElementsByTagNameを呼び出し

var div = document.getElementsByTagName("div")[0]; 
div.addEventListener("click", function(){alert(1);}, true); 

var buttons = div.getElementsByTagName("button"); 
buttons[0].addEventListener("click", function(){alert(2);}, false); 
buttons[1].addEventListener("click", function(){alert(2);}, false); 

は自明テキストノードをスキップします - 問題は解決します！

Answer 2

改行時にtextNodesを作成せずにHTMLコードを記述することはできますか？

いいえ。あなたは、私は解決策は、あなたが後にしているものではないことを推測クライアント、に送信する前にHTMLファイルを解析しない限り

...

Answer 3

申し訳ありません。 PHP、RUBYなどのプログラミング言語を使用してHTMLコードを生成し、このようなものを追加する可能性があります。

<input type="button" value="Button 1"><%- 
%><input type="button" value="Button 2"> 

しかし、私はそれがあなたが聞きたい答えではないと思います。