替换所有 HREF 标记的字符串将从 HREF 内部取值答案

【问题标题】：Replacing string of all HREF tags will value from inside HREF替换所有 HREF 标记的字符串将从 HREF 内部取值
【发布时间】：2021-11-04 11:33:31
【问题描述】：

我在尝试将 HREF 标记的一部分插入字符串时遇到问题-

<a class="link product-name" href="/s/website/website-2/familyseries1/at/abcd.html" itemprop="url">Some Text</a>


<a class="link product-name" href="/s/website/website-2/familyseries2/at/abcd.html" itemprop="url">Some Text</a>

需要改成-

<a class="link product-name" href="/s/website/website-2/familyseries1/at/abcd.html" itemprop="url">familyseries1</a>

<a class="link product-name" href="/s/website/website-2/familyseries2/at/abcd.html" itemprop="url">familyseries2</a>

到目前为止，我有这段代码可以正确替换所有字符串，但我的每次调用只使用第一次出现的familyseries，这个值在页面上的所有出现中都是不同的。

$("a.product-name").each(function(){
    var familySeries = $('.product-name').attr('href').split('/')[4];
    $('a.product-name').text(familySeries);
});

我目前的输出是-

<a class="link product-name" href="/s/website/website-2/familyseries1/at/abcd.html" itemprop="url">familyseries1</a>

<a class="link product-name" href="/s/website/website-2/familyseries2/at/abcd.html" itemprop="url">familyseries1</a>

【问题讨论】：

标签： javascript jquery each

【解决方案1】：

问题在于您没有在每次迭代中指定正确的元素。以下实现应该可以解决问题：

$("a.product-name").each(function(){
    var familySeries = $( this ).attr('href').split('/')[4];
    $( this ).text(familySeries);
});

在这里编写代码：https://codepen.io/GeneralPoxter/pen/ExXNBMd?editors=1010

【讨论】：

跟进：jQuery attr() 方法只返回第一个匹配的元素，在您的原始代码中，您每次迭代都对所有 product-name 元素 ($('.product-name')) 执行此操作。