如何使用Javascript选择所有具有特定文本内容的锚点标签？

Question

我想使用document.querySelector()中的选择器来选取所有文本为“print”的a标签。

<a href="https://www.google.co.in">print</a>

如何选择相同的元素。我不想使用jQuery。它不一定只是querySelector，任何其他选择器都可以。

- Nagarjun Prasad

---

你是想使用querySelector()还是不想用？我没听懂你的意思。 - Mohamed Sa'ed

我的意思是，可以使用其他选择器形式，如按标签名称获取元素等。 - Nagarjun Prasad

Answer 1

var findElements = function(tag, text) {
  var elements = document.getElementsByTagName(tag);
  var found = [];
  for (var i = 0; i < elements.length; i++) {
    if (elements[i].innerHTML === text) {
      found.push(elements[i]);
    }
  }
  
  return found;
}

console.log(findElements('a', 'print'));

<a href="https://www.google.co.in">print</a>
<a href="https://www.google.co.in">skip</a>

- Ele

Answer 2

你可以使用以下 JavaScript 函数：

function contains(selector, text) {
   var elements = document.querySelectorAll(selector);
   return Array.prototype.filter.call(elements, function(element){
     return RegExp(text).test(element.textContent);
   });
}

同时，可以使用以下方式进行调用：

var results = contains('a', 'print'); // find "a" that contain "print"
var results = contains('a', /^print/); // find "a" that start with "print"
var results = contains('a', /print$/i); // find "a" that end with "print", case-insensitive

Source

- CodeIt

---

那是抄袭。只需在评论中附上链接即可。 - mplungjan

@mplungjan 我知道，但我已经提到了答案的来源。 - CodeIt

Answer 3

要选择所有锚点，您应该使用document.querySelectorAll()。

然后简单地循环遍历节点列表，并检查内部HTML是否为“print”。

然后将其推入数组。此数组包含所有文本为“print”的锚链接。

var anchors = document.querySelectorAll('a');
var selectedLinks = []

for (var i = 0; i < anchors.length; i++) {
  var link = anchors[i];

  if (link.innerHTML === 'print') {
    selectedLinks.push(link) 
  }
}

- SimplePixels