如何使用jQuery或Javascript将字符串添加到<a href =“中？

Question

我有如下的HTML元素：

<div id="pager">
<a href="/somepath/1">First</a>
<a href="/somepath/1">Previous</a>
<a class="" href="/somepath/1">1</a>
<a class="Current" href="/somepath/2">2</a>
<a class="" href="/somepath/3">3</a>
<a href="/somepath/3">Next</a>
<a href="/somepath/20">Last</a>
</div>

我希望您可以在浏览器中进行如下更改。

<div id="pager">
<a href="/somepath/1?a=text">First</a>
<a href="/somepath/1?a=text">Previous</a>
<a class="" href="/somepath/1?a=text">1</a>
<a class="Current" href="/somepath/2?a=text">2</a>
<a class="" href="/somepath/3?a=text">3</a>
<a href="/somepath/3?a=text">Next</a>
<a href="/somepath/20?a=text">Last</a>
</div>

为了让我可以在下一页使用“a”数据值，有人能给我一个代码吗，在

内附加代码。

div id="pager" -> <a> -> href="

我希望通过另一个onChange事件来删除添加的文本。 提前致谢。

- user9371102

Answer 1

由于jQuery被标记为：

$('#pager a').each(function(){
     this.href += '?a=text';
})

原生JS代码如下：

var a = document.getElementById('pager').getElementsByTagName('a'),
    length = a.length;

for(var i=0; i< length; i++){
    a[i].href += '?a=text';
}

- Karl-André Gagnon

---

@Bondye，.each函数有什么问题吗？“+1终于有一个没有使用.each()函数的人了...人们不理解.each()..”你在发表这个评论的答案中，你认为代码背后会发生什么？此外，.each()更快：http://jsperf.com/each-vs-function - Karl-André Gagnon

个人而言，我更喜欢使用 .attr() 和一个函数代替 .each() ，因为我觉得这样更易读。但是我无法反驳性能测试的结论。（不知道 jQuery 中是否有优化可以解决这个问题？） - Blazemonger

@Blazemonger 嗯，那是个人偏好，因为我更喜欢使用.each()，所以我们不能争论这个 :) @Bondye 它不会循环两次，实际上它与使用函数的结果相同（就像Blaze的答案一样）。这里是jQuery代码中相关的部分：for ( ; i < length; i++ ) { fn( elems[i], key, raw ? value : value.call( elems[i], i, fn( elems[i], key ) ) ); }。唯一添加到.each方式的是一个额外的函数调用（这就是为什么each更快的原因）。我认为你的评论更适用于像.addClass()`这样的函数，它没有必要遍历元素并在之后调用它。 - Karl-André Gagnon

@Blazemonger 顺便说一下，纯JS是最慢的。你有什么想法吗？（我可能在代码中做错了什么）？ - Karl-André Gagnon

@Karl-AndréGagnon，如何使用另一个onChange事件删除添加的文本“?a=text”？ - user9371102

Answer 2

.attr()和许多jQuery函数一样，可以接受修改现有值的函数参数：

$('#pager a').attr('href',function(i,str) {
   return str + '?a=text';
});

- Blazemonger

---

@Blazemonger 谢谢，我会接受Karl-André Gagnon的答案。你的回答很棒，如何使用另一个onChange事件来删除添加的文本"?a=text"？ - user9371102

应该使用 "return str.split('?')[0];"。 - Blazemonger

Answer 3

$('#pager a').each(function() {
   $(this).attr('href', $(this).attr('href') + '?a=text');
});

- Barış Uşaklı

Answer 4

只需使用attr属性。例如：

$("a").attr("href", "http://www.google.com/")

这将完成工作。

- Aamir Shah

Answer 5

$("#pager").find("a").each(function(){
var $this=$(this);
$this.attr("href",$this.attr("href")+"?a=text");
})

- vikrant singh

Answer 6

你可以使用attr方法。

$('a').attr('href', '/somepath/1?a=text');

如果您想更改特定的href，请给它一个唯一的id，然后按以下方式更改其href。

$('#link').attr('href', '/somepath/1?a=text');

- Khawer Zeshan

Answer 7

尝试这段代码：

试试这段代码：

$('#pager a').each(function(){
    this.href += '?a=text'
})

- Lucas Willems