IE7与其他浏览器在提取.attr("href")时出现错误？

Question

在所有浏览器中，attr("href") 命令在处理链接时是否真的与 IE7 处理方式有很大不同呢？

假设我有一个页面位于 http://example.com/page.html，并且我有以下 HTML 代码：

<a href="#someAnchor" class="lnkTest">Link text</a>

还有这段 jQuery 代码：

var strHref = $(".lnkTest").attr("href");

在IE7中，strHref变量的值将是"http://example.com/page.htm#someAnchor"，但在其他浏览器中它将是"#someAnchor"。我认为后一种情况是最正确的，那么这只是因为IE7不好吗，还是jQuery有一个bug？

- EmKay

---

这有点两者兼而有之 - IE7不一致，但jQuery仍应该处理它。 - Keith

这也发生在IE8中，我最近发现了这一点。不确定要删除哪个标签才能添加它。但绝对不仅限于jQuery。当使用getAttributeNode("href")时会发生这种情况。 - Jonathon Watney

Answer 1

这显然不是jQuery的bug，而是浏览器实现.getAttribute('href')存在的不一致性 - 我建议使用.get(0).href以保持一致性。

如果您不想要绝对URI，则可以在IE和Mozilla中使用.get(0).getAttribute('href', 2)访问属性文本。请注意，这种方法在Opera中不起作用，我也没有测试过Safari/Chrome/其他任何浏览器。

您还可以从.get(0).href中剥离域名或按'#'分割数组，并使用第二部分（检查.length是否包含'#'）。

http://www.glennjones.net/Post/809/getAttributehrefbug.htm

- meder omuraliev

---

这不是关于如何检索href的锚部分的问题。我自己想出了那个方法。我只是好奇为什么存在这样的差异。 但无论如何，非常感谢您的回答。我需要获取锚点部分，所以我只使用了substring来提取正确的值 :) - EmKay

今天我在IE8中遇到了这个问题。我们发现，如果使用完全限定的域名，即http://app.somedomain.com/virtualDir/page.aspx，则会返回属性文本。但是，如果只使用NetBIOS机器名称，则将返回绝对URL...很奇怪。 - CedricB

jQuery可以帮助标准化行为，就像它处理事件对象一样。 - Ates Goral

现在已经修复了，不过我不知道是什么时候修复的，我用1.7.1测试过。 - Matijs

Answer 2

我相信在所有IE 7+中都是这样实现的。

我使用：

var href=jQuery('#foo').attr('href');
href=href.substring(href.indexOf('#'));

希望能够帮到您！祝好！

- Teo Sibileau

---

似乎有一个this.hash属性也可以使用，详见JavaScript圣经第603页（http://goo.gl/OF16Q），在大多数浏览器中，至少在IE 7中。这样你就不需要调用 substr 了。 - KajMagnus

Answer 3

我发现一个与这个问题相关的错误：http://bugs.jquery.com/ticket/2747。jQuery实施了IE7“bug”的解决方法。然而，在jQuery 1.7.1中，这个错误被重新引入了。我为1.7.1创建了一个新的错误：http://bugs.jquery.com/ticket/11129。

- timing

---

我注意到这个错误被标记为“无法重现”，但是他们提供的测试用例有问题。我创建了一个新的JSFiddle测试来说明这个错误 - 希望这个问题会重新打开。 - Marc Novakowski

Answer 4

我使用：

var hrefArr = $(this).attr('href').split('/');
var id = hrefArr[hrefArr.length-1];

当我需要最后一个“/”之后的所有内容时。

- chrwahl

---

但是如果href是"http://example.com/folder/page.htm"或者仅仅是"/folder/page.htm"呢？ 那么你将只会得到"page.htm"，这是不正确的。 - EmKay

这只是为了展示一个简单的例子。我这里没有代码示例，但你可以遍历数组并检查字符串。例如，在包含“.com”结尾的子字符串之后的所有字符串。很直接。 - chrwahl

你应该使用正则表达式来处理这种事情。这样做的话，出错的可能性会小得多。 - Benbob

Answer 5

另一种方法是仅使用数据属性而非 href。

<a data-href="#anchor-0">example</a>

.

var href = $(this).attr('data-href');

- Johansrk

Answer 6

我最终通过PHP创建了一个变量，然后使用JavaScript的replace()方法将其从href中删除：

<script>var domain = 'http://<?=$_SERVER['HTTP_HOST']?>';</script>

<script>
$(function(){
/* prevent default action of all anchors with hash class */
$('#canvas').on('click', 'a.hash', function(event) {
    event.preventDefault();
            // get the href of the anchor
    var hash = '!' + $(this).attr('href');
            // remove the absolute url if it exists
    hash = hash.replace( domain, '' );
    // redirect
            window.location.hash = hash;
});
});
</script>

- Trevor Lettman

Answer 7

问题在于IE7和IE8也会改变文本。因此，一个好的解决方法是这样做：

$('#linkId').attr('href','newlink').text('oldtext');

- catalinux