使用 JavaScript 或 jQuery 解析 URL答案

【问题标题】：parse URL with JavaScript or jQuery使用 JavaScript 或 jQuery 解析 URL
【发布时间】：2011-12-12 00:32:48
【问题描述】：

好吧，假设我有一个网址

example.com/hello/world/20111020（带或不带斜杠）。我想要做的是从域 example.com 的 URL 中删除。然后将 hello world 20111020 分解成一个数组。但我的另一个问题是。有时 URL 没有 /hello/world/20111020 或只有 /hello/ 所以我需要首先确定 example.com 之后是否有任何内容，如果没有，然后什么也不做，因为显然没有什么可使用的。但是，如果每个 / 都有一些东西，我需要按顺序将它添加到这个数组中。所以我可以使用数组 [0] 并知道它是你好。

几天前我尝试了一些东西，但遇到了斜杠问题，它不断破坏脚本，不幸的是我放弃了这个想法。而今天我正在寻找新的想法。

【问题讨论】：

标签： javascript jquery parsing url slug

【解决方案1】：

您可以使用jQuery-URL-Parser 插件：

var file = $.url.attr("file");

在您的情况下，您可能希望使用segment()：

var segments = $.url('http://allmarkedup.com/folder/dir/example/index.html').segment(); 

// segments = ['folder','dir','example','index.html']

【讨论】：

【解决方案2】：

   <script type="text/javascript">
    function splitThePath(incomingUrl){
     var url = document.createElement("a");
     url.href = incomingUrl;
    //url.hash  Returns the anchor portion of a URL
    //url.host  Returns the hostname and port of a URL
    //url.hostname  Returns the hostname of a URL
    //url.href  Returns the entire URL
    //url.pathname  Returns the path name of a URL
    //url.port  Returns the port number the server uses for a URL
    //url.protocol  Returns the protocol of a URL
    //url.search    Returns the query portion of a URL
    if(url.pathname && url.pathname != ""){
   var pathnameArray = url.pathname.split("/");
 }else{

}


}
</script>

【讨论】：

第一次设置 url.href 时，客户端的浏览器会填写其余的值。

【解决方案3】：

我为 URL 创建了以下正则表达式

^https?://(((0|([1-9][0-9]{0,1}))(\.(0|([1-9][0-9]{0,1}))){3})|([a-zA-Z]([a-zA-Z0-9$\-_@\.&+!*"\'\(\),]|(%[0-9a-fA-F][0-9a-fA-F]))*(\.([a-zA-Z]([a-zA-Z0-9$\-_@\.&+!*"\'\(\),]|(%[0-9a-fA-F][0-9a-fA-F]))*))*))(/|((/([a-zA-Z]([a-zA-Z0-9$\-_@\.&+!*"\'\(\),]|(%[0-9a-fA-F][0-9a-fA-F]))*))*))$

它是为 MySql 编写的 - 我相信只要稍加摆弄，您就可以满足您的需求。

顺便说一句 - 我从 RFC 中获得了这个想法 - 这个数字现在让我忘记了

【讨论】：

【解决方案4】：

这应该可以工作

var url = 'example.com/hello/world/20111020/';
//get rid of the trailing / before doing a simple split on /
var url_parts = url.replace(/\/\s*$/,'').split('/'); 
//since we do not need example.com
url_parts.shift();

现在url_parts 将指向数组["hello", "world", "20111020"]。

【讨论】：

var url = window.location.href; 解析当前 url :)
@johnny 您应该获取url_parts 数组的内容，而不是命令url_parts.shift() 的输出

【解决方案5】：

对于解析 URL，另一种方法是使用锚点 DOM 对象。

var a = document.createElement("A");
a.href = 'http://example.com:8080/path/to/resources?param1=val1&params2=val2#named-anchor';

a.protocol; // http:
a.host; // example.com:8080
a.hostname; //example.com
a.port; // 8080 (in case of port 80 empty string returns)
a.pathname; // /path/to/resources
a.hash; // #named-anchor
a.search // ?param1=val1&params2=val2

【讨论】：