如何使用jQuery更改超链接的href属性(链接目标)?


当前回答

对于jQuery 1.6及以上版本,您应该使用:

$("a").prop("href", "http://www.jakcms.com")

prop和attr的区别在于,attr获取HTML属性,而prop获取DOM属性。

你可以在这篇文章中找到更多细节:.prop()vs.attr()

其他回答

更改Wordpress Avada主题徽标图像的HREF

如果你安装了ShortCode Exec PHP插件,你可以创建这个我称为myjavascript的短代码

?><script type="text/javascript">
jQuery(document).ready(function() {
jQuery("div.fusion-logo a").attr("href","tel:303-985-9850");
});
</script>

现在,您可以转到外观/小部件,选择一个页脚小部件区域,并使用文本小部件添加以下短代码

[myjavascript]

选择器可能会根据您使用的图像以及视网膜是否就绪而改变,但您始终可以使用开发人员工具来确定。

 $("a[href^='http://stackoverflow.com']")
   .each(function()
   { 
      this.href = this.href.replace(/^http:\/\/beta\.stackoverflow\.com/, 
         "http://stackoverflow.com");
   });

根据您是希望将所有相同的链接更改为其他链接,还是希望仅控制页面给定部分中的链接,或者单独控制每个链接,您可以执行以下操作之一。

更改所有指向谷歌的链接,使其指向谷歌地图:

<a href="http://www.google.com">

$("a[href='http://www.google.com/']").attr('href', 
'http://maps.google.com/');

要更改给定节中的链接,请将容器div的类添加到选择器中。此示例将更改内容中的Google链接,但不会更改页脚中的链接:

<div class="content">
    <p>...link to <a href="http://www.google.com/">Google</a>
    in the content...</p>
</div>

<div class="footer">
    Links: <a href="http://www.google.com/">Google</a>
</div>

$(".content a[href='http://www.google.com/']").attr('href', 
'http://maps.google.com/');

要更改各个链接而不管它们在文档中的位置,请向链接添加一个id,然后将该id添加到选择器。此示例将更改内容中的第二个Google链接,但不会更改第一个或页脚中的链接:

<div class="content">
    <p>...link to <a href="http://www.google.com/">Google</a>
    in the content...</p>
    <p>...second link to <a href="http://www.google.com/" 
        id="changeme">Google</a>
    in the content...</p>
</div>

<div class="footer">
    Links: <a href="http://www.google.com/">Google</a>
</div>

$("a#changeme").attr('href', 
'http://maps.google.com/');

href,因此您可以使用纯JavaScript来更改它,但如果您已经在页面中注入了jQuery,请不要担心,我将以两种方式显示它:

假设您有以下href:

<a id="ali" alt="Ali" href="http://dezfoolian.com.au">Alireza Dezfoolian</a>

你喜欢改变它的链接。。。

使用纯JavaScript而不使用任何库,您可以执行以下操作:

document.getElementById("ali").setAttribute("href", "https://stackoverflow.com");

但在jQuery中也可以做到:

$("#ali").attr("href", "https://stackoverflow.com");

or

$("#ali").prop("href", "https://stackoverflow.com");

在这种情况下,如果您已经注入了jQuery,那么jQuery可能看起来更短,更跨浏览器。。。但除此之外,我会选择JS的。。。

对于jQuery 1.6及以上版本,您应该使用:

$("a").prop("href", "http://www.jakcms.com")

prop和attr的区别在于,attr获取HTML属性,而prop获取DOM属性。

你可以在这篇文章中找到更多细节:.prop()vs.attr()