如何解决为什么 document.querySelector 无法在 Javascript 中找到类名
刚刚开始使用 JavaScript 中的 document.querySelector
。为什么会
let result = document.querySelector('Lh')
返回空值。我已经尝试了许多将 div 作为搜索字符串的一部分的排列,但是在 div 中它一定有什么不同吗?通配符建议...
let result1 = document.querySelector('[class^="Lh(21px)"]')
let result2 = document.querySelector('[class^=".Lh(21px)"]')
let result3 = document.querySelector('[class^="Lh"]')
let result4 = document.querySelector('[class^=".Lh"]')
所有返回空值。
<div class="" data-test="quote-mdl" data-yaft-module="tdv2-applet-summary">
<div class="Mb(25px) smartphone_Px(20px)">
<h3 class="Mb(5px)"><span>Summary</span></h3>
<div class="Lh(21px)">Lorem ipsum dolor sit amet,consectetur adipiscing elit.
Sed et magna magna. Praesent in condimentum quam. Phasellus dui ligula,tincidunt porta fermentum nec. rhoncus id enim. Duis tempor,tellus at
fermentum consectetur,nisl ipsum placerat metus,sed aliquam turpis enim eget erat.
</div>
</div>
</div>
解决方法
<div class="Lh(21px)">Lorem ipsum dolor ...
您的类名是 Lh(21px)
而不是 Lh
,如果您想匹配任何以 Lh
开头的类名,请使用提供的解决方案在this answer:
let result1 = document.querySelector('[class^="Lh"]');
console.log(result1)
<div class="" data-test="quote-mdl" data-yaft-module="tdv2-applet-summary">
<div class="Mb(25px) smartphone_Px(20px)">
<h3 class="Mb(5px)"><span>Summary</span></h3>
<div class="Lh(21px)">Lorem ipsum dolor sit amet,consectetur adipiscing elit.
Sed et magna magna. Praesent in condimentum quam. Phasellus dui ligula,tincidunt porta fermentum nec. rhoncus id enim. Duis tempor,tellus at
fermentum consectetur,nisl ipsum placerat metus,sed aliquam turpis enim eget erat.
</div>
</div>
</div>
根据 MDN:
文档方法 querySelector() 返回文档中与指定选择器或选择器组匹配的第一个元素。如果未找到匹配项,则返回 null。
Lh 不是有效的选择器,因为它不是标签而是类名。所以你应该把你的代码改成这样:
const divElement = document.querySelector(".Lh\\(21px\\)")
[编辑]:如果使用括号,请添加反斜杠
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。