Javascript 在循环中忽略包含文本字符串的特定元素

Question

我必须遍历具有以下内容的 html 文档：

<a class="DetailLink" href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....>Legal research.</a>
<a class="DetailLink" href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....><img...></a>

第一个元素包含我要捕获的文本，第二个元素包含我不需要的图像。我有以下代码来遍历它：

var Row = document.querySelector("#exploreTable");
var Cells = Row.querySelectorAll("li a[href*='&searchType=subject'] li a:not([alt*='Find It'])");

l = Cells.length
var number = 1
for (var i = 0; i < l; i++, number++ ) {
 console.log(number + ". " + Cells[i].innerText);
}

我在这种情况下使用 querySelector。有没有办法在 querySelectorAll 中添加以忽略具有 img 元素的 a 元素？我该如何度过呢？或者还有另一种方法吗？我正在尝试在此之后添加 && 条件：

li a[href*='&searchType=subject'

但似乎这不是正确的方法。也许还有另一种方法可以做到吗？谢谢，干杯！

Answer 1

您可以在找到的所有 li a 项之上再做一个 querySelectorAll 使用 Cells[i].querySelectorAll("img").length < 1 检查里面是否有 img 标签，然后只打印那些里面没有 img 标签的标签，如下所示：

var Row = document.querySelector("#exploreTable");
var Cells = Row.querySelectorAll("li a[href*='&searchType=subject']");
l = Cells.length;
var number = 1;
var arr = [];
for (var i = 0; i < l; i++, number++) {
  if(Cells[i].querySelectorAll("img").length < 1){
    arr.push(Cells[i].innerText);
  }
}

for(var i=0; i< arr.length; i++){
console.log(i +". " + arr[i]);

}

<div id="exploreTable">
  <li>
    <a class="DetailLink" href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....">Legal research.</a>
  </li>
  <li>

    <a class=" DetailLink " href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....">Image
      <img src=""/>
    </a>
  </li>
  
    <li>

    <a class=" DetailLink " href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....">No Image again
    </a>
  </li>
</div>

或为了更好的表现

var Row = document.querySelector("#exploreTable");
var Cells = Row.querySelectorAll("li a[href*='&searchType=subject']");
l = Cells.length;
var number = 1;
for (var i = 0; i < l; i++) {
  if(Cells[i].querySelectorAll("img").length < 1){
    console.log(number +". " + Cells[i].innerText);
    number++
  }
}

<div id="exploreTable">
  <li>
    <a class="DetailLink" href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....">Legal research.</a>
  </li>
  <li>

    <a class=" DetailLink " href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....">Image
      <img src=""/>
    </a>
  </li>
  
    <li>

    <a class=" DetailLink " href="/cataloging/servlet/presentbrowseheadingdetailform.do?siteTypeID=-2&amp;searchType=subject....">No Image again
    </a>
  </li>
</div>

Javascript 在循环中忽略包含文本字符串的特定元素

Javascript ignore in loop particular element that contains a string of text

html

javascript

selectors-api