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. kettle转换添加hbase-output无法获取hbase表

    问题:kettle转换添加hbase-output无法获取hbase表 win本机安装kettle,本机虚拟机三台,root用户安装有jdk.zookeeper.hadoop.hbase kettle ...

  2. ionic 配置打包环境

    配置java环境就不说了,太简单 下载AndroidSdkAndroid SDK Tools翻过墙的朋友可以去Google Android的官网上下载:http://developer.android ...

  3. PHP双向队列,双端队列代码

    <?php /**  * User: jifei  * Date: 2013-07-30  * Time: 23:12 */ /**  * PHP实现双向队列,双端队列  * 双端队列(dequ ...

  4. SCP命令只能单项拷贝,另一个方向“RSA host key for 172.16.103.176 has changed and you have requested strict checki Host key verification failed. lost connection”问题

    [dinghuaneng@95 move_data]$ scp * dinghuaneng@172.16.103.176:/home/dinghuaneng@@@@@@@@@@@@@@@@@@@@@@ ...

  5. zookeeper No route to host

    2017-10-12 07:25:59,270 [myid:1] - WARN [QuorumPeer[myid=1]/0:0:0:0:0:0:0:0:2181:QuorumCnxManager@36 ...

  6. netty7---自定义序列化接口

    package com.cn.core; import java.nio.ByteOrder; import java.nio.charset.Charset; import java.util.Ar ...

  7. Promise原理剖析

    传统的异步回调编程最大的缺陷是:回调地狱,由于业务逻辑非常复杂,代码串行请求好几层:并行请求以前也要通过引用step.async库实现.现在ES6推出了Promise,通过Promise的链式调用可以 ...

  8. JAVA面试题整理(3)-Spring

    1.BeanFactory 和 FactoryBean? 2.Spring IOC 的理解,其初始化过程? 3.BeanFactory 和 ApplicationContext? 4.Spring B ...

  9. cordova linux 安装并编出第一个demo-android

    cordova可以做到一次编写到处运行各个平台(android.ios.wp.bb.firefoxos.web等几乎所有平台) 手上只有一个android手机 ,安装的时候没有那么顺利,第一大问题就是 ...

  10. 20145333《Java程序设计》课程总结

    每周读书笔记链接汇总 第一周学习总结 第二周学习总结 第三周学习总结 第四周学习总结 第五周学习总结 第六周学习总结 第七周学习总结 第八周学习总结 第九周学习总结 第十周学习总结 实验报告链接汇总 ...