JavaScript中有时需要用到当前的请求路径等涉及到url的情况,正常情况下我们可以使用location对象来获取我们需要的信息,本文从另外一个途径来解决这个问题,而且更加巧妙

方法如下:

  1. function parseURL(url) {
  2. var a =  document.createElement('a');
  3. //创建一个链接
  4. a.href = url;
  5. return {
  6. source: url,
  7. protocol: a.protocol.replace(':',''),
  8. host: a.hostname,
  9. port: a.port,
  10. query: a.search,
  11. params: (function(){
  12. var ret = {},
  13. seg = a.search.replace(/^\?/,'').split('&'),
  14. len = seg.length, i = 0, s;
  15. for (;i<len;i++) {
  16. if (!seg[i]) { continue; }
  17. s = seg[i].split('=');
  18. ret[s[0]] = s[1];
  19. }
  20. return ret;
  21. })(),
  22. file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1],
  23. hash: a.hash.replace('#',''),
  24. path: a.pathname.replace(/^([^\/])/,'/$1'),
  25. relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1],
  26. segments: a.pathname.replace(/^\//,'').split('/')
  27. };
  28. }

复制代码

使用方法如下:

  1. var myURL = parseURL('http://abc.com:8080/dir/index.html?id=255&m=hello#top');
  2. myURL.file;     // = 'index.html'
  3. myURL.hash;     // = 'top'
  4. myURL.host;     // = 'abc.com'
  5. myURL.query;    // = '?id=255&m=hello'
  6. myURL.params;   // = Object = { id: 255, m: hello }
  7. myURL.path;     // = '/dir/index.html'
  8. myURL.segments; // = Array = ['dir', 'index.html']
  9. myURL.port;     // = '8080'
  10. myURL.protocol; // = 'http'
  11. myURL.source;   // = 'http://abc.com:8080/dir/index.html?id=255&m=hello#top'

复制代码

一个不错的JavaScript解析浏览器路径方法的更多相关文章

  1. 一个不错的JavaScript解析浏览器路径方法(转)

    JavaScript中有时需要用到当前的请求路径等涉及到url的情况,正常情况下我们可以使用location对象来获取我们需要的信息,本文从另外一个途径来解决这个问题,而且更加巧妙 方法如下: fun ...

  2. Js解析浏览器路径的方法

    方法如下:function parseURL(url) { var a = document.createElement('a'); //创建一个链接 a.href = url; return { s ...

  3. JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息. JavaScript代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 1 ...

  4. javascript的window.ActiveXObject对象,区别浏览器的方法

    (window.ActiveXObject)的作用,用来判断浏览器是否支持ActiveX控件,如果支持ActiveX控件,我们可以利用var xml=new ActiveXObject("M ...

  5. C#字符串数组排序 C#排序算法大全 C#字符串比较方法 一个.NET通用JSON解析/构建类的实现(c#) C#处理Json文件 asp.net使用Jquery+iframe传值问题

    C#字符串数组排序   //排序只带字符的数组,不带数字的 private   string[]   aa   ={ "a ", "c ", "b & ...

  6. Javascript调用C#后台方法及JSon解析

    Javascript调用C#后台方法及JSon解析   如何使用Ajax 调用C# 后台方法. 本文目录 如何使用Ajax 调用C# 后台方法. 1.后台(.cs)测试方法 2.前台调用(javasc ...

  7. 浏览器中“JavaScript解析器”工作原理

    浏览器在读取HTML文件的时候,只有当遇到<script>标签的时候,才会唤醒所谓的“JavaScript解析器”开始工作. JavaScript解析器工作步骤: 1.“找一些东西”: v ...

  8. Javascript创建对象几种方法解析

    Javascript创建对象几种方法解析 Javascript面向对象编程一直是面试中的重点,将自己的理解整理如下,主要参考<Javascript高级程序设计 第三版>,欢迎批评指正. 通 ...

  9. 原生JavaScript常用本地浏览器存储方法一(方法类型)

    有时需要将网页中的一些数据保存在浏览器端.好处就是当下次访问页面时,直接就可以从本地读取数据,不需要再次向服务器请求数据.目前常用的有以下几种方法: 1.cookie cookie会随着每次HTTP请 ...

随机推荐

  1. awk的常用操作场景以及工作中涉及到的一些场景实例

    废话不多说,直接上这个实例: 一. 统计apache日志单ip访问请求数排名:  假设apache日志内容access.log内容为: /Dec/::: +] - /Dec/::: +] - /Dec ...

  2. Apache配置虚拟主机的三种方法(基于IP、端口、域名)

    1 Apache虚拟主机的实现方式有3种. 基于IP的虚拟主机 基于端口的虚拟主机 基于域名的虚拟主机 2.1 启用虚拟主机的准备工作 2.1.1安装httpd [root@mail httpd]# ...

  3. HTML5游戏开发系列教程5(译)

    原文地址:http://www.script-tutorials.com/html5-game-development-lesson-5/ 最终我决定准备下一篇游戏开发系列的文章,我们将继续使用can ...

  4. 字典的fromkeys的用法

    fromkeys方法语法 dict.fromkeys(iterable[,value=None]) iterable 用于创建新的字典的键的可迭代对象(字符串,列表,元组,字典) value 可选参数 ...

  5. XVII Open Cup named after E.V. Pankratiev Grand Prix of Moscow Workshops, Sunday, April 23, 2017 Problem K. Piecemaking

    题目:Problem K. PiecemakingInput file: standard inputOutput file: standard outputTime limit: 1 secondM ...

  6. ISAP模板

    #include<bits/stdc++.h> using namespace std; using namespace std; typedef long long ll; const ...

  7. Hadoop集群的各部分常用端口

    hadoop集群的各部分一般都会使用到多个端口,有些是daemon之间进行交互之用,有些是用于RPC访问以及HTTP访问.而随着hadoop周边组件的增多,完全记不住哪个端口对应哪个应用,特收集记录如 ...

  8. Python笔记 #03# Help!

    源:DataCamp datacamp 的 DAILY PRACTICE  + 日常收集. Functions Built-in functions Help! Multiple arguments ...

  9. WPF和Sliverlight不同之UIElement-事件

    WPF: http://msdn.microsoft.com/en-us/library/System.Windows.UIElement.aspx DragEnter DragLeave DragO ...

  10. 贝叶斯公式由浅入深大讲解—AI基础算法入门【转】

    本文转载自:https://www.cnblogs.com/zhoulujun/p/8893393.html 1 贝叶斯方法 长久以来,人们对一件事情发生或不发生的概率,只有固定的0和1,即要么发生, ...