javascript - 在 javascript 中创建一个新的 Location 对象

Question

是否可以在 javascript 中创建一个新的 Location 对象？我有一个 url 作为字符串，我想利用 javascript 已经提供的内容来访问它的不同部分。

这是我正在谈论的一个例子（我知道这不起作用）：

var url = new window.location("http://www.example.com/some/path?name=value#anchor");
var protocol = url.protocol;
var hash = url.hash;
// etc etc

这样的事情是否可能，或者我基本上必须自己创建这个对象？

Answer 1

好吧，您可以使用锚元素来提取 url 部分，例如：

var url = document.createElement('a');
url.href = "http://www.example.com/some/path?name=value#anchor";
var protocol = url.protocol;
var hash = url.hash;

alert('protocol: ' + protocol);
alert('hash: ' + hash);
​

它适用于所有现代浏览器，甚至适用于 IE 5.5+。

在此处查看示例。

Answer 2

如何使用标准URL 对象？

const url = new URL("http://www.example.com/some/path?name=value#anchor");
const { hash } = url;

然后console.log(hash)会输出#anchor。

警告：这个接口有点新，所以，如果你没有使用转译器，请检查兼容性表并在目标浏览器上进行测试。

Answer 3

您可以利用锚元素的力量

var aLink = document.createElement("a");
aLink.href="http://www.example.com/foo/bar.html?q=123#asdf";
alert(aLink.pathname);

Answer 4

您可以在正则表达式中解析它以获取匹配的部分......我现在没有完整的代码，但这可以用来获取查询数据：

var myUrl = window.location.href;
var matches = myUrl.match(/([^\?]+)\?(.+)/);
var queryData = matches[2];

match[0] 是完整的字符串，matches(1) 是 URL 的第一部分（直到？）...如果需要，您可以构建一个正则表达式来解析字符串 url 的每个部分...

您也可以为此使用已经存在的众多库之一。