Javascript querySelectorAll不返回DOM中的所有元素
我正在做一个附带项目,其中HTML文件被生成并发送到前端,在前端使用Polymer 3和其他技术进行格式化和显示 长话短说,当我调用Javascript querySelectorAll不返回DOM中的所有元素,javascript,dom,web,polymer,components,Javascript,Dom,Web,Polymer,Components,我正在做一个附带项目,其中HTML文件被生成并发送到前端,在前端使用Polymer 3和其他技术进行格式化和显示 长话短说,当我调用querySelectorAll时,它不会返回文档中的所有锚定标记: document.querySelectorAll("a"); 相反,它似乎只承认标记的存在,如果它们是调用querySelectorAll的节点的直接子节点。因此,如果我有: <div> <custom-tag1> <custom-tag2>
querySelectorAll
时,它不会返回文档中的所有锚定标记:
document.querySelectorAll("a");
相反,它似乎只承认标记的存在,如果它们是调用querySelectorAll
的节点的直接子节点。因此,如果我有:
<div>
<custom-tag1>
<custom-tag2>
<a href="http://www.google.com">Google</a>
<a href="http://www.yahoo.com">Yahoo!</a>
<a href="http://www.amazon.com">Amazon</a>
</custom-tag2>
</custom-tag2>
</div>
它将返回一个空列表。我必须这样做:
theBody.querySelectorAll("div")[0].querySelectorAll("custom-tag1")[0].querySelectorAll("custom-tag2")[0].querySelectorAll("a");
为了得到锚元素的列表
但是,如果锚存在于其他任何地方,它将无法获得它们
注意事项:
聚合3服务器正在运行。
一些元素(至少我在Chrome的调试器中看到的那些元素)是阴影根,这一事实可能会使情况变得复杂
因此,有时我们最终会这样做:
someNode.shadowRoot.querySelectorAll("a");
或类似的
任何帮助或见解都将不胜感激。是的!正如@Jonas Wilms所说,它是“”。
没有所谓的“.”是的!正如@Jonas Wilms所说,它是“”。
如果在所有自定义tagX
元素的ready
方法(以及在onload
中)中执行控制台。记录,则您将了解原因。你会看到的结果是这样的
body is ready
custom-tag1 is ready
custom-tag2 is ready
。。。这意味着当主体完成加载时,将加载特定于聚合物的自定义元素
所以要解决这个问题,您需要在加载特定元素时发送一个事件,并让body使用addEventListener
来侦听它
然而,当谈到聚合物时,你不应该这样想
您为什么想要
希望这至少能给你一些指导。如果你在所有的自定义tagX
元素的ready
方法中(以及在onload
中)使用控制台.log
,那么你就会明白为什么了。你会看到的结果是这样的
body is ready
custom-tag1 is ready
custom-tag2 is ready
。。。这意味着当主体完成加载时,将加载特定于聚合物的自定义元素
所以要解决这个问题,您需要在加载特定元素时发送一个事件,并让body使用addEventListener
来侦听它
然而,当谈到聚合物时,你不应该这样想
您为什么想要
希望这至少能提供一些指导。这是querySelectorAll
…是的,我道歉。我只是把问题打错了。实际代码具有正确的调用。它是querySelectorAll
…是的,我道歉。我只是把问题打错了。实际代码有正确的调用。是的,对不起-我刚刚修复了。这不是最初的问题——这在我的实际代码中是正确的。我打字的时候是凌晨3点,我忘了打“或”-很抱歉。问题仍然存在。是的,对不起-我刚刚解决了。这不是最初的问题——这在我的实际代码中是正确的。我打字的时候是凌晨3点,我忘了打“或”-很抱歉。问题依然存在。