我有这个html结构
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="paper"></li>
<li class="rock"></li>
</ul>
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="paper"></li>
<li class="rock"></li>
</ul>
我想从元素中得到带有类容器的，所有带有类纸的第一个孩子。
我试过了
let selected=document.querySelectorAll(".container:first-child.paper");
但错了。 如何获得正确的查询选择器？
您的选择器不正确，不能将您要查找的元素作为目标。
试试看
let selected = document.querySelectorAll(".container .paper:first-child");
演示:
null
let selected = document.querySelectorAll(".container .paper:first-child");
console.log(selected);<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="paper">1234</li>
<li class="rock"></li>
</ul>
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="paper">ABCD</li>
<li class="rock"></li>
</ul>
null
let selected= document.querySelectorAll(".container .paper:first-child");
selected.forEach(e => e.textContent = 'First Paper'); <ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="paper"></li>
<li class="rock"></li>
</ul>
<ul class="container">
<li class="rock"></li>
<li class="paper"></li>
</ul>
<ul class="container">
<li class="paper"></li>
<li class="rock"></li>
</ul>
我想你的代码只运行了一次。 也许您应该尝试循环每个查询或选择所有查询。
