如何在JavaScript中提取URL的主机名部分

是否有一种从完整网址开始的简单方法：

document.location.href = "http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah"

并仅提取主机部分：

aaa.bbb.ccc.com

必须有一个可靠地执行此操作的JavaScript函数，但我找不到它。

假设您有一个地址为的页面http://sub.domain.com/virtualPath/page.htm。使用页面代码中的以下内容获得这些结果：

• window.location.host：您会得到sub.domain.com:8080或sub.domain.com:80
• window.location.hostname ： 你会得到 sub.domain.com
• window.location.protocol ： 你会得到 http:
• window.location.port：您会得到8080或80
• window.location.pathname ： 你会得到 /virtualPath
• window.location.origin：你会得到http://sub.domain.com*****

更新：关于.origin

*****如参考文献所述，浏览器的兼容性window.location.origin尚不清楚。我已经在chrome中检查了http://sub.domain.com:port该端口，http://sub.domain.com如果端口不是80 ，则返回该端口，如果端口是80 ，则返回该端口。

特别感谢@torazaburo向我提及。

您可以连接位置协议和主机：

var root = location.protocol + '//' + location.host;

对于网址，可以说'http://stackoverflow.com/questions'，它将返回'http://stackoverflow.com'

使用document.location对象及其host或hostname属性。

alert(document.location.hostname); // alerts "stackoverflow.com"

接受的答案对我不起作用，因为它希望能够使用任何任意网址，而不仅仅是当前页面的网址。

看一下URL对象：

var url = new URL("http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah");
url.protocol;  // "http:"
url.hostname;  // "aaa.bbb.ccc.com"
url.pathname;  // "/asdf/asdf/sadf.aspx"
url.search;    // "?blah"

有两种方法。第一个是此处另一个答案的变体，但这是非默认端口的原因：

function getRootUrl() {
  var defaultPorts = {"http:":80,"https:":443};

  return window.location.protocol + "//" + window.location.hostname
   + (((window.location.port)
    && (window.location.port != defaultPorts[window.location.protocol]))
    ? (":"+window.location.port) : "");
}

但我更喜欢这种简单的方法（可与任何URI字符串一起使用）：

function getRootUrl(url) {
  return url.toString().replace(/^(.*\/\/[^\/?#]*).*$/,"$1");
}

采用

window.location.origin

并用于：“ http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah ”

您将获得：http : //aaa.bbb.ccc.ddd.com/

尝试

document.location.host

要么

document.location.hostname

我使用了另一个技巧，但从未在任何StackOverflow响应中看到该技巧：使用图像的“ src”属性将产生您网站的完整基本路径。例如 ：

var dummy = new Image;
dummy.src = '$';                  // using '' will fail on some browsers
var root = dummy.src.slice(0,-1); // remove trailing '$'

在类似的网址上http://domain.com/somesite/index.html， root将设置为http://domain.com/somesite/。这也适用于localhost或任何有效的基本URL。

请注意，这将导致$虚拟映像上的HTTP请求失败。您可以使用现有图像来避免这种情况，只需稍作更改即可。

另一个变体使用伪链接，对HTTP请求没有副作用：

var dummy = document.createElement ('a');
dummy.href = '';
var root = dummy.href;

不过，我并未在每个浏览器上都进行过测试。

检查一下：

alert(window.location.hostname);

这将返回主机名 www.domain.com

和：

window.location.host

将返回带有以下端口的域名 www.example.com:80

有关完整参考，请访问Mozilla开发人员站点。

我想指定一些东西。如果有人想使用我需要的路径获取整个URL，可以使用：

var fullUrl = window.location.protocol + "//" + window.location.hostname + window.location.pathname;

我知道这有点晚了，但是我用一点ES6语法做了一个干净的小函数

function getHost(href){
  return Object.assign(document.createElement('a'), { href }).host;
}

也可以像这样在ES5中编写

function getHost(href){
  return Object.assign(document.createElement('a'), { href: href }).host;
}

IE当然不支持Object.assign，但是在我的工作中，这并不重要。

正则表达式提供了更多的灵活性。

    //document.location.href = "http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah
    //1.
     var r = new RegExp(/http:\/\/[^/]+/);
     var match = r.exec(document.location.href) //gives http://aaa.bbb.ccc.com

    //2. 
     var r = new RegExp(/http:\/\/[^/]+\/[^/]+/);
     var match = r.exec(document.location.href) //gives http://aaa.bbb.ccc.com/asdf