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


当前回答

更改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").attr("href", "http://www.google.com/")

将修改所有超链接的href以指向Google。不过,您可能需要一个更精细的选择器。例如,如果您有链接源(超链接)和链接目标(也称为“锚”)锚标记的组合:

<a name="MyLinks"></a>
<a href="http://www.codeproject.com/">The CodeProject</a>

…然后您可能不想意外地将href属性添加到它们中。为了安全起见,我们可以指定我们的选择器将仅与具有现有href属性的<a>标记匹配:

$("a[href]") //...

当然,你可能会有更有趣的想法。如果要将锚点与特定的现有href相匹配,可以使用以下内容:

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

这将找到href与字符串完全匹配的链接http://www.google.com/.一个更复杂的任务可能是匹配的,然后只更新href的一部分:

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

第一部分仅选择href开头的链接http://stackoverflow.com.然后,定义一个函数,该函数使用一个简单的正则表达式将URL的这部分替换为一个新的。请注意,这给了您灵活性——对链接的任何修改都可以在这里完成。

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的。。。

简单的方法是:

Attr函数(自jQuery 1.0版起)

$("a").attr("href", "https://stackoverflow.com/") 

or

Prop函数(自jQuery 1.6版起)

$("a").prop("href", "https://stackoverflow.com/")

此外,上述方法的优点是,若选择器选择单个锚点,它将仅更新该锚点,若选择器返回一组锚点,则它将仅通过一条语句更新特定组。

现在,有很多方法可以确定确切的锚点或锚点组:

非常简单的:

通过标记名称选择锚点:$(“a”)通过索引选择锚点:$(“a:eq(0)”)为特定类选择锚点(如在该类中仅锚点类活动):$(“a.active”)选择具有特定ID的锚点(在示例profileLink中ID):$(“a#proileLink”)选择第一个锚点href:$(“a:first”)

更有用的:

选择具有href属性的所有元素:$(“[href]”)选择具有特定href:$(“a[href='ww.stacksoverflow.com']”)的所有锚点选择不具有特定href:$(“a[href!='ww.stacksoverflow.com']”)的所有锚点选择具有包含特定URL的href的所有锚点:$(“a[href*='ww.stacksoverflow.com']”)选择以特定URL:$(“a[href^='ww.stacksoverflow.com']”)开头的所有锚点选择以特定URL结尾的所有锚点:$(“a[href$='ww.stacksoverflow.com']”)

现在,如果你想修改特定的URL,你可以这样做:

例如,如果您想为所有指向google.com的URL添加代理网站,可以按如下方式实现:

$("a[href^='http://www.google.com']")
   .each(function()
   { 
      this.href = this.href.replace(/http:\/\/www.google.com\//gi, function (x) {
        return "http://proxywebsite.com/?query="+encodeURIComponent(x);
    });
   });

更改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]

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

在查找时使用attr方法。您可以使用新值关闭任何属性。

$("a.mylink").attr("href", "http://cupcream.com");