Javascript 从链接的 href 属性获取完整的 URI

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2639070/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 01:16:14  来源:igfitidea点击:

Get the full URI from the href property of a link

javascripthyperlink

提问by Savageman

I would like to have a confirmation on some point.

我想在某些方面得到确认。

My goal is to always get the same string (which is the URI in my case) while reading the href property from a link. Example:

我的目标是在从链接读取 href 属性时始终获得相同的字符串(在我的例子中是 URI)。例子:

<a href="test.htm" />with base_url = http://domain.name/

<a href="test.htm" />使用 base_url = http://domain.name/

<a href="../test.htm" />with base_url = http://domain.name/domain/

<a href="../test.htm" />使用 base_url = http://domain.name/domain/

<a href="http://domain.name/test.htm" />with base_url = any folder from http://domain.name/

<a href="http://domain.name/test.htm" />使用 base_url = 来自http://domain.name/ 的任何文件夹

I need to get http://domain.name/test.htmfrom the 3 situations above (or any other identical string).

我需要http://domain.name/test.htm从上述 3 种情况(或任何其他相同的字符串)中获取。

After some tests, it appears that my_a_dom_node.hrefalways return the full-qualified URI, including the http://domaine.name, which should be okay for what I want.

经过一些测试,似乎 my_a_dom_node.href总是返回完全限定的 URI,包括http://domaine.name,这对于我想要的应该没问题。

jQuery has a different behaviour and $(my_a_dom_node).attr('href')returns the content (text) that appears inside the HTML. So my trick is to use $(my_a_dom_node).get(0).hrefto get the full URI.

jQuery 具有不同的行为并$(my_a_dom_node).attr('href')返回出现在 HTML 中的内容(文本)。所以我的技巧是使用$(my_a_dom_node).get(0).href获取完整的 URI。

The question is: can I rely on this?

问题是:我可以依靠这个吗?

采纳答案by Marco Demaio

YES, you can rely!

是的,您可以信赖!

Once when people was using simple javascript (no jQuery) many asked the opposite of what you are asking, they wanted to get the real url as written in the href attribute and not the full one, in such case they used to simply do:

有一次,当人们使用简单的 javascript(没有 jQuery)时,许多人提出了与您所问相反的问题,他们想获得 href 属性中所写的真实网址,而不是完整的网址,在这种情况下,他们曾经简单地这样做:

my_a_dom_node.getAttribute('href', 2); //works both IE/FF

Then it came jQuery that helped people not to waste their time in finding out they would need such code and jQuery always returns the real url as written in the href attribute.

然后它出现了 jQuery,它帮助人们不要浪费时间去发现他们需要这样的代码,并且 jQuery 总是返回写在 href 属性中的真实 url。

It's funny that now someone is asking how to get the full url because jQuery returns the one written in the href attribute.

有趣的是,现在有人问如何获取完整的 url,因为 jQuery 返回写在 href 属性中的那个。

回答by arakell

I know it's an old question, but this being actually the first entry that popped up, I believe it's good to add an extra solution. Ever since jQuery introduced the "prop" function, getting the full URL is as simple as:

我知道这是一个老问题,但这实际上是第一个出现的条目,我相信添加一个额外的解决方案很好。自从 jQuery 引入了“prop”函数,获取完整的 URL 就这么简单:

$(my_a_dom_node).prop('href');

I hope that still helps somebody.

我希望这仍然可以帮助某人。

回答by Tomalak

Yes, you can rely on this.

是的,您可以信赖这一点。

Looking through the jQuery (1.4.2) source code, I see the jQuery.attr()function being used (condensed to the relevant parts):

查看 jQuery (1.4.2) 源代码,我看到jQuery.attr()正在使用的函数(浓缩到相关部分):

jQuery.extend({
  // ...
  attr: function( elem, name, value, pass ) {
    // ...

    var attr = !jQuery.support.hrefNormalized && notxml && special ?
               // Some attributes require a special call on IE
               elem.getAttribute( name, 2 ) :
               elem.getAttribute( name );

    // Non-existent attributes return null, we normalize to undefined
    return attr === null ? undefined : attr;    
  }
});

So it′effectively calls elem.getAttribute('href')which returns the actual attribute value, while the hrefproperty by design returns the canonical URL.

所以它'有效地调用elem.getAttribute('href')返回实际属性值,而href属性设计返回规范URL。

However, there is a reference to jQuery.support.hrefNormalized, of which the jQuery support site has to say:

但是,有一个对 的引用jQuery.support.hrefNormalized,其中 jQuery 支持站点必须说:

  • hrefNormalized: Is equal to true if the .getAttribute()method retrieves the hrefattribute of elements unchanged, rather than normalizing it to a fully-qualified URL. (It is currently false in IE, the URLs are normalized). DOM l3 spec
  • hrefNormalized: 如果该.getAttribute()方法检索href元素的属性不变,而不是将其规范化为完全限定的 URL,则等于 true 。(目前在 IE 中为 false,URL 已规范化)。DOM l3 规范

This basically means that jQuery finds out browser behavior on its own and adapts accordingly to provide a consistent result.

这基本上意味着 jQuery 自己找出浏览器行为并相应地进行调整以提供一致的结果。

回答by rnaud

You could recompose the full url using a bit of javascript :

您可以使用一些 javascript 重构完整的 url:

function parseLink(link) {
    var baseUrl = location.href.substring(0,location.href.lastIndexOf('/'));
    if (link.indexOf('/') != -1) {
        link = link.substring(link.lastIndexOf('/')); 
    } else {
        link = "/"+ link;
    }
    var fullUrl = baseUrl + link;
    return fullUrl
}