javascript - 如何使用查询选择器从 标记中包含的列表项中删除文本装饰？

Question

我想使用javascript(最好是查询选择器)从特殊项目中删除textDecoration。但我不知道我做错了什么。这里是代码。CodePen

<h1>Thanks for the Help!</h1>
  <h1> My problem set </h1>
  <ul>
    <li id="highlight">List Item 1</li>
    <li class="bolded">List Item 2</li>
    <a href="#" class="special"><li class="bolded">List Item 3</li></a>
  </ul>

var sLi = document.querySelector("ul a.special");
for (var i = 0; i <= sLi.length; i++){
  sLi[i].style.textDecoration = "none";
}

Answer 1

无需循环查询结果，因为 querySelector() 仅返回一项。

如果您一直在使用querySelectorAll()，您会希望循环返回一个节点列表。

var sLi = document.querySelector("ul a.special");
sLi.style.textDecoration = "none";

<h1>Thanks for the Help!</h1>
  <h1> My problem set </h1>
  <ul>
    <li id="highlight">List Item 1</li>
    <li class="bolded">List Item 2</li>
    <li class="bolded"><a href="#" class="special">List Item 3</a></li>
  </ul>

另外(仅供引用)，li 应该包含 a，而不是相反。