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

Get all a elements inside td's from a div outside the table with Javascript

我目前正在努力获取所有 A 元素,其中 td 位于 table 内,table 位于重复 [=17= 内].

这就是我的 html 代码的格式

我希望每个 a 元素都在一个变量中,下面我将使用我拥有的功能单击所有这些元素,但不要介意。

所以我试过了

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

但是显然没有得到a元素。 知道如何在 Javascriot(而不是 jquery)中做到这一点吗??

非常感谢~

这应该可以用 document.querySelectorAll() 解决:

Returns 文档中与指定的 selectors 组匹配的元素列表(使用文档节点的深度优先预序遍历)。返回的对象是一个 NodeList.


该函数接受 CSS selector。所以这应该给你你正在寻找的链接:

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

一个小例子:

var links = document.querySelectorAll(".uiScrollableAreaContent ._1pt_ table.uiGrid a._1pu2._1pu4");
links.forEach(l => l.classList.add("highlight"));
.highlight { background-color: yellow }
<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>