2 回答

TA貢獻1848條經(jīng)驗 獲得超10個贊
CSS 中的大于號 ( >) 選擇器用于選擇具有特定父級的元素。它被稱為元素>元素選擇器。它也稱為子組合選擇器,這意味著它僅選擇父元素的直接子元素。它看起來只是標記結構的下一層,而不是更深入的部分。不選擇不是指定父級的直接子級的元素。
相反,您應該使用 awhite space來匹配元素的所有后代
const clickedFaq = document.querySelectorAll(`div#faq-1 div.lol`);
console.log(clickedFaq)
<div class="pb-30 faq" id="faq-1">
<div class="flex flex-row">
<div class="w-20">
<div class="hw-24 lol close" id="test">
</div>
</div>
</div>
<div class="close-dialog lol" id="test-2">
<div class="flex flex-col">
</div>
</div>
</div>

TA貢獻1829條經(jīng)驗 獲得超7個贊
您想要使用后代組合器而不是子組合器。
這意味著在選擇器中替換>
為空格
。
console.log(document.querySelectorAll(".faq .lol"));
?<div class="pb-30 faq" id="faq-1">
? ?<div class="flex flex-row">
? ? ?<div class="w-20">
? ? ? ?<div class="hw-24 lol close" id="test">
? ? ? ? ?test
? ? ? ?</div>
? ? ?</div>
? ?</div>
? ?<div class="close-dialog lol" id="test-2">
? ? ?test
? ? ?<div class="flex flex-col">
? ? ?</div>
? ?</div>
</div>
添加回答
舉報