通过包含的单词获取元素答案

【问题标题】：Get element by a word it contains通过包含的单词获取元素
【发布时间】：2021-02-08 21:12:24
【问题描述】：

有没有办法通过它的内容来获取一个元素（它包含的一个词？）

例如，获取所有带有字母“F”的元素，并将其放入元素数组中

【问题讨论】：

【解决方案1】：

我强烈建议您使用jQuery 进行此类 DOM 元素搜索。然后你可以使用这个：

var foos = $("div:contains('foo')" )

将创建一个包含所有包含单词 'foo' 的 div 的数组。

【讨论】：

唯一要记住的是它区分大小写。

【解决方案2】：

一种相当简单的方法是选择您感兴趣的元素，然后使用“过滤器”查看innerText。您可以使用toLowerCase 使此大小写不敏感

var result = $('div').filter( (i,e) => e.innerText.toLowerCase().indexOf("f")>-1);
console.log("Items with 'F':",result.length);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>Forest</div>
<div>Fortnight</div>
<div>Trees</div>
<div>Africa</div>

更简单的方法是使用 :contains('F') 作为选择器 - 但这始终区分大小写（这可能适合您的情况）。

【讨论】：

【解决方案3】：

您可以使用:contains 作为选择器。例如，要过滤还包含您的文本的特殊类的所有 div，您可以使用 $("div.myclass:contains('searched text')")

【讨论】：

【解决方案4】：

我认为您可以通过迭代所有 DOM 项目来“强制”它。例如：

let arrayDom = Array.from(document.getElementsByTagName("*"));
       arrayDom.forEach(element => {
           if (element.innerHTML.contains('F')){
               // Do something
           }
       })

【讨论】：

非常感谢，这是我能找到的最佳解决方案。不过我有一个小问题，当你说 getElementsByTagName("*") 时，我想通过所有标签名称获取所有元素。我可以写这样的东西吗？ document.getElementsByTagNam("div") 请让我知道一个解决方案，因为这种方式并没有真正奏效。我试过 querySelectorAll 还是不行。我该如何解决这个问题？
实际上，我得到了它的工作。我尝试了一种稍微不同的方法。然而，你帮了很多忙。谢谢！