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

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

这样的事情有可能吗? 还是我必须自己创建这个对象？

31589 次浏览

小开

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

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

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

您还可以使用已经存在的许多库中的一个来进行此操作。

小开

最佳答案

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

检查一个例子给你。

小开

你可以利用锚元素的力量

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

小开

使用标准的 URL 对象怎么样？

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

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

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