How to select an anchor element based on some text in the URL?

I tried this:

我试过这个:

var els = document.querySelectorAll('a[href*="dabbing-through-the-snow"]')

There are 36 elements on the page with links like this one:

页面上有36个元素,其链接如下:

https://www.teepublic.com/t-shirt/3298777-funny-maltese-dabbing-through-the-snow-dab-christm?store_id=138163.

However, my code selected all the links on the page, I think.

但是,我认为我的代码选择了页面上的所有链接。

How to ONLY select the links that have the text, for example, dabbing-through-the-snow?

如何仅选择包含文本的链接,例如,通过雪花?

2 个解决方案

#1

You can use document.querySelectorAll([attribute*=value]) to select all elements with the attribute containing the value string, so your code should be correct.

您可以使用document.querySelectorAll([attribute * = value])来选择具有包含值字符串的属性的所有元素,因此您的代码应该是正确的。

var els = document.querySelectorAll('a[href*="dabbing-through-the-snow"]');
var anchors = document.querySelectorAll('a');
console.log("Anchors:", anchors.length, "Matched Anchors:", els.length);

<a href="">1</a>
<a href="https://www.teepublic.com/t-shirt/3298777-funny-maltese-dabbing-through-the-snow-dab-christm?store_id=138163">2</a>

You may also want to traverse through all the anchor elements with a for loop if you have more complicated criteria.

如果您有更复杂的条件,您可能还希望使用for循环遍历所有锚元素。

var anchors = document.querySelectorAll("a");
var href = "dabbing-through-the-snow";
var found = [];

for (var i = 0; i < anchors.length; i++) {
  if (anchors[i].href.includes(href)) {
    found.push(anchors[i]);
  }
}
console.log("Anchors:", anchors.length, "Matched Anchors:", found.length);

<a href="">1</a>
<a href="https://www.teepublic.com/t-shirt/3298777-funny-maltese-dabbing-through-the-snow-dab-christm?store_id=138163">2</a>

#2

You can try following code to get href with string :

您可以尝试使用以下代码来获取字符串的href:

const $aHref = $("a").filter((index, value) => $(value).attr('href').match(/\/dabbing-through-the-snow\//));
const urlString = $.map($aHref, data => $(data).attr('href'));
console.log(urlString);

#1