浅谈js的url解析函数封装


Posted in Javascript onJune 28, 2016

在实际开发中,有些通过get方式与后台交换数据的时候,需要用到的数据在url中,因此就需要我们来获取到url中有用的信息,下面封装的函数已经可以将url解析的很彻底了,可以拿来直接用的:

function parseURL(url) {
   var a = document.createElement('a');
    a.href = url;
    return {
      source: url,
      protocol: a.protocol.replace(':',''),
      host: a.hostname,
      port: a.port,
      query: a.search,
      params: (function(){
        var ret = {},
          seg = a.search.replace(/^\?/,'').split('&'),
          len = seg.length, i = 0, s; //len = 2
          alert(a.search)
        for (;i<len;i++) {
          if (!seg[i]) { continue; }
          s = seg[i].split('=');
          ret[s[0]] = s[1];
        }
        return ret;
      })(),
      file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1],
      hash: a.hash.replace('#',''),
      path: a.pathname.replace(/^([^\/])/,'/$1'),
      relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1],
      segments: a.pathname.replace(/^\//,'').split('/')
    };
  }

该函数的用法如下:

var myURL = parseURL(window.location.href); //通过parseURL函数来解析当前页面的url;window.location.href可替换成任意要解析的url,如果直接写其他的url,格式应该字符串;
var search_obj = myURL.params;//该解析方式是将search的内容解析为对象,方便进行数据的调用;其他方法可以自行尝试;
var url_post = myURL.post;
//当前页面的端口号;

以上就是小编为大家带来的浅谈js的url解析函数封装全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
jQuery 点击图片跳转上一张或下一张功能的实现代码
Mar 12 Javascript
查找页面中所有类为test的结点的方法
Mar 28 Javascript
淘宝网提供的国内NPM镜像简介和使用方法
Apr 17 Javascript
javascript结合canvas实现图片旋转效果
May 03 Javascript
3个可以改善用户体验的AngularJS指令介绍
Jun 18 Javascript
Node.js项目中调用JavaScript的EJS模板库的方法
Mar 11 Javascript
JS+Canvas绘制时钟效果
Aug 20 Javascript
js将json格式的对象拼接成复杂的url参数方法
May 25 Javascript
基于jquery实现多级菜单效果
Jul 25 jQuery
详解vue后台系统登录态管理
Apr 02 Javascript
antd配置config-overrides.js文件的操作
Oct 31 Javascript
react项目从新建到部署的实现示例
Feb 19 Javascript
JavaScript中点击事件的写法
Jun 28 #Javascript
js改变style样式和css样式的简单实例
Jun 28 #Javascript
js改变css样式的三种方法推荐
Jun 28 #Javascript
Javascript中获取浏览器类型和操作系统版本等客户端信息常用代码
Jun 28 #Javascript
获取input标签的所有属性的方法
Jun 28 #Javascript
JavaScript ES6的新特性使用新方法定义Class
Jun 28 #Javascript
javascript 常用验证函数总结
Jun 28 #Javascript
You might like
短波问题解答
2021/02/28 无线电
php 上一篇,下一篇文章实现代码与原理说明
2010/05/09 PHP
PHP通用检测函数集合
2011/02/08 PHP
PHP开发中常用的十个代码样例
2016/02/02 PHP
js限制textarea每行输入字符串长度的代码
2012/10/31 Javascript
Jquery选择子控件&quot;大于号&quot;和&quot; &quot;区别介绍及使用示例
2013/06/25 Javascript
js获取input长度并根据页面宽度设置其大小及居中对齐
2014/08/22 Javascript
在JavaScript中处理字符串之fontcolor()方法的使用
2015/06/08 Javascript
浅谈String.valueOf()方法的使用
2016/06/06 Javascript
深入解析Javascript闭包的功能及实现方法
2016/07/10 Javascript
jQuery+PHP+Mysql实现抽奖程序
2020/04/12 jQuery
详谈commonjs模块与es6模块的区别
2017/10/18 Javascript
详解VueJS应用中管理用户权限
2018/02/02 Javascript
nuxt框架中路由鉴权之Koa和Session的用法
2018/05/09 Javascript
[01:04:31]DOTA2-DPC中国联赛定级赛 iG vs Magma BO3第二场 1月8日
2021/03/11 DOTA
python备份文件的脚本
2008/08/11 Python
Python之日期与时间处理模块(date和datetime)
2017/02/16 Python
CentOS 6.5下安装Python 3.5.2(与Python2并存)
2017/06/05 Python
Python实现读取txt文件并画三维图简单代码示例
2017/12/09 Python
Python异常处理操作实例详解
2018/05/10 Python
TensorFlow Session使用的两种方法小结
2018/07/30 Python
Python从使用线程到使用async/await的深入讲解
2018/09/16 Python
tensorflow如何继续训练之前保存的模型实例
2020/01/21 Python
python文件和文件夹复制函数
2020/02/07 Python
python TCP包注入方式
2020/05/05 Python
python批量合成bilibili的m4s缓存文件为MP4格式 ver2.5
2020/12/01 Python
Window10上Tensorflow的安装(CPU和GPU版本)
2020/12/15 Python
python的setattr函数实例用法
2020/12/16 Python
5分钟弄清楚html5的drag and drop(小结)
2019/04/10 HTML / CSS
沃尔玛加拿大:Walmart.ca
2020/03/02 全球购物
屈臣氏越南官网:Watsons越南
2021/01/14 全球购物
思想品德自我鉴定
2013/10/12 职场文书
师范应届毕业生自荐信
2013/11/18 职场文书
3分钟英语演讲稿
2014/04/29 职场文书
干货分享:推荐信写作技巧!
2019/06/21 职场文书
Python快速优雅的批量修改Word文档样式
2021/05/20 Python