javascript – 在新行之后避免创建textNode?
作者:互联网
如果我在HTML文件中手动编写以下行:
<div>
<input type="button" value="Button 1">
<input type="button" value="Button 2">
</div>
将为每个新行创建一个文本节点.
我想了解addEventListener方法的useCapture参数.
我选择使用div元素的childNodes属性访问DOM元素,但我必须忽略元素之间的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个输入标签.
有没有办法绕过textNodes创建而无需在一行上编写所有HTML代码而不使用Javascript createElement?
是否可以在转到新行时编写HTML代码而不创建textNodes?
解决方法:
首先,不要重复自己!你一遍又一遍地重复相同的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来获取按钮可以轻松跳过文本节点 – 问题解决了!
标签:javascript,dom,html,textnode 来源: https://codeday.me/bug/20190630/1333899.html