Избегайте создания textNode после новой строки?

Question

Если я вручную писать эти следующие строки в HTML-файле:

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

Текстовый узел будет создан для каждой новой строки.

Я хотел понять аргумент useCapture метода addEventListener. Я выбрал доступ к элементам DOM, используя свойство childNodes моего элемента div, но мне придется игнорировать textNodes между элементами. Это на самом деле не практично:

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); 

Здесь вы видите, что я должен игнорировать childNodes[0] и childNodes[2] для того, чтобы выбрать мои 2 входных меток.

Есть ли способ обойти создание текстовых образов без написания всего HTML-кода только на одной строке и без использования Javascript createElement?

Возможно ли написать код HTML без создания textNodes при переходе на новую строку?

Answer 1

Во-первых, не повторяйте себя! Вы повторяете один и тот же запрос DOM снова и снова.

Попробуйте это:

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); 

вызова getElementsByTagName, чтобы получить кнопки тривиальным Пропускает текстовые узлы - проблема решена!

Answer 2

Возможно ли написать код HTML без создания textNodes при переходе на новую строку?

Nope.

Если вы не разобрать файл HTML перед его отправкой клиенту, который я предполагаю, что решение не то, что вы после ...

Answer 3

К сожалению. Только возможность генерации HTML-кода с использованием языка программирования, такого как PHP, RUBY, и добавить что-то вроде этого.

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

Но я думаю, что это не ответ, который вы хотите услышать.