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


当前回答

试试这个;

$("#link").attr("href", "https://coenvink.com/")

代码功能的分解:

$("#link")

这部分代码获取id为“Link”的元素。之后,您将属性“href”(witch基本上是url的链接)设置为新的url,在本例中,witch是我自己的网站:

.attr("href", "https://coenvink.com/")

我希望现在清楚了!

其他回答

试试这个;

$("#link").attr("href", "https://coenvink.com/")

代码功能的分解:

$("#link")

这部分代码获取id为“Link”的元素。之后,您将属性“href”(witch基本上是url的链接)设置为新的url,在本例中,witch是我自己的网站:

.attr("href", "https://coenvink.com/")

我希望现在清楚了!

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

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

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

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

简单的方法是:

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);
    });
   });

尽管OP明确要求jQuery的答案,但现在您不需要对所有事情都使用jQuery。

一些没有jQuery的方法:

如果要更改所有<a>元素的href值,请将其全部选中,然后遍历节点列表:(示例)var anchors=document.querySelectorAll('a');Array.protocol.forEach.call(锚,函数(元素,索引){element.href=“http://stackoverflow.com";});如果要更改实际具有href属性的所有<a>元素的href值,请通过添加[href]属性选择器(a[href]])来选择它们:(示例)var anchors=document.querySelectorAll('a[href]');Array.protocol.forEach.call(锚,函数(元素,索引){element.href=“http://stackoverflow.com";});如果要更改包含特定值的<a>元素的href值,例如google.com,请使用属性选择器a[href*=“google.com”]:(示例)var anchors=document.querySelectorAll('a[href=“google.com”]');Array.protocol.forEach.call(锚,函数(元素,索引){element.href=“http://stackoverflow.com";});同样,您也可以使用其他属性选择器。例如:a[href$=“.png”]可用于选择href值以.png结尾的<a>元素。a[href^=“https://”]可用于选择具有前缀为https://的href值的<a>元素。如果要更改满足多个条件的<a>元素的href值:(示例)var anchors=document.querySelectorAll('a[href=“https://”],a[href=“.png”]');Array.protocol.forEach.call(锚,函数(元素,索引){element.href=“http://stackoverflow.com";});

..在大多数情况下不需要正则表达式。

当单击类“menu_link”的链接时,此代码段将调用,并显示链接的文本和url。返回false将阻止链接被跟踪。

<a rel='1' class="menu_link" href="option1.html">Option 1</a>
<a rel='2' class="menu_link" href="option2.html">Option 2</a>

$('.menu_link').live('click', function() {
   var thelink = $(this);
   alert ( thelink.html() );
   alert ( thelink.attr('href') );
   alert ( thelink.attr('rel') );

   return false;
});