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

IT技术 javascript url-parsing
2021-02-24 06:19:25

是否可以在 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

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

4个回答

好吧，您可以使用锚元素来提取 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+。

在此处查看示例。

+1 我正在输入的内容。这<a>元素实现的locationURL分解属性可以追溯到最早的JavaScript版本和无处不在的支持。它（终于！）在 HTML5 规范中标准化了。
2021-04-19 06:19:25
我想我试过一次，然后发现对于 IE，我需要在它工作之前将它添加到 DOM。也许我需要再试一次。
2021-04-21 06:19:25
一个重要的注意事项：Internet Explorer 似乎有一个错误，它省略了像这样的对象的路径名属性上的前导斜杠。您可以通过执行以下操作对其进行标准化： url.pathname = url.pathname.replace(/(^\/?)/,"/");
2021-04-24 06:19:25
我不知道你能做到这一点。整洁的。
2021-04-29 06:19:25
+1。同上。我也不知道<a>实施位置。
2021-05-13 06:19:25

如何使用标准的URL 对象？

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

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

只要您不需要支持 Internet Explorer，这绝对是最好的解决方案。URL 接口使用所有与 Location 相同的属性名称，因此它完全向后兼容，但它还添加了一个非常有用的searchParams属性。
2021-04-23 06:19:25
不要忘记newin new URL(。
2021-05-09 06:19:25

您可以利用锚元素的力量

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

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

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

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

为此，您还可以使用现有的众多库之一。

其它你可能感兴趣的问题
上一篇在 PDF 文件中使用 JavaScript 代码的文档 下一篇Javascript循环遍历对象数组？