使用Javascript从表外的div中获取td内的所有元素

Question

我目前正在讨论如何获取位于A里面的td内的所有table元素，这些元素位于重复的div内}。

所以这是我的HTML代码的格式

我希望每个a元素都在一个变量中，然后我会用我的函数点击所有这些元素，但不要介意。

所以我试过这个

var scrl = document.getElementsByClassName("uiScrollableAreaContent");
var circleditems = scrl[scrl.length-1].getElementsByClassName("_1pu2 _1pu4");

但它显然没有获得a元素。 任何想法如何在Javascriot（不是在jquery）??

非常感谢〜

Answer 1

这应该可以通过document.querySelectorAll()解决：

返回与指定的selectors组匹配的文档中的元素列表（使用文档节点的深度优先预先遍历遍历）。返回的对象是NodeList。

该函数接受CSS selector。因此，这应该为您提供您正在寻找的链接：

document.querySelectorAll(".uiScrollableAreaContent ._1pt_ table.uiGrid a._1pu2._1pu4");

一个小例子：

＆＃13;

＆＃13;

var links = document.querySelectorAll(".uiScrollableAreaContent ._1pt_ table.uiGrid a._1pu2._1pu4");
links.forEach(l => l.classList.add("highlight"));

＆＃13;

.highlight { background-color: yellow }

＆＃13;

<div class="uiScrollableAreaContent">
  <div class="_1pt_">
    <table class="uiGrid">
    <tbody>
      <tr><td><a href="#" class="">1</a></td></tr>
      <tr><td><a href="#" class="_1pu2 _1pu4">2</a></td></tr>
      <tr><td><a href="#" class="">3</a></td></tr>
      <tr><td><a href="#" class="_1pu2 _1pu4">4</a></td></tr>
    </tbody>
    </table>
  </div>
  <p>
    <a href="#" class="_1pu2 _1pu4">lorem ipsum</a>
  </p>
</div>

＆＃13;

＆＃13;

＆＃13;