浅谈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.alert 弹出式复选框实现代码
Jun 15 Javascript
CutePsWheel javascript libary 控制输入文本框为可使用滚轮控制的js库
Feb 07 Javascript
jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例
Jun 17 Javascript
js中document.write使用过程中的一点疑问解答
Mar 20 Javascript
javascript实现日期时间动态显示示例代码
Sep 08 Javascript
AngularJS整合Springmvc、Spring、Mybatis搭建开发环境
Feb 25 Javascript
详述JavaScript实现继承的几种方式(推荐)
Mar 22 Javascript
AngularJs 动态加载模块和依赖
Sep 15 Javascript
vue2.0构建单页应用最佳实战
Apr 01 Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
Apr 26 Javascript
关于使用js算总价的问题
Jun 23 Javascript
使用vue for时为什么要key【推荐】
Jul 11 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
解析PHP函数array_flip()在重复数组元素删除中的作用
2013/06/27 PHP
php中unserialize返回false的解决方法
2014/09/22 PHP
php格式化时间戳显示友好的时间实现思路及代码
2014/10/23 PHP
PHP中error_reporting()用法详解
2015/08/31 PHP
制作个性化的WordPress登陆界面的实例教程
2016/05/21 PHP
Win7环境下Apache连接MySQL提示连接已重置的解决办法
2017/05/09 PHP
JS操作XML中DTD介绍及使用方法分析
2019/07/04 PHP
laravel5环境隐藏index.php后缀(apache)的方法
2019/10/12 PHP
论坛里点击别人帖子下面的回复,回复标题变成“回复 24# 的帖子”
2009/06/14 Javascript
深入理解JQuery keyUp和keyDown的区别
2013/12/12 Javascript
jQuery on()方法使用技巧详解
2015/04/16 Javascript
判断访客终端类型集锦
2015/06/05 Javascript
JS处理json日期格式化问题
2015/10/01 Javascript
JavaScript控制浏览器全屏及各种浏览器全屏模式的方法、属性和事件
2015/12/20 Javascript
Jquery针对tr td的一些实用操作方法(必看篇)
2016/10/05 Javascript
JS实现中国公民身份证号码有效性验证
2017/02/20 Javascript
详解打造 Vue.js 可复用组件
2017/03/24 Javascript
vue实现点击关注后及时更新列表功能
2018/06/26 Javascript
vue定义全局变量和全局方法的方法示例
2018/08/01 Javascript
JavaScript实现与使用发布/订阅模式详解
2019/01/19 Javascript
微信小程序自定义组件传值 页面和组件相互传数据操作示例
2019/05/05 Javascript
Ant Design Pro 下实现文件下载的实现代码
2019/12/03 Javascript
vue学习之Vue-Router用法实例分析
2020/01/06 Javascript
JS代码简洁方式之函数方法详解
2020/07/28 Javascript
jQuery列表动态增加和删除的实现方法
2020/11/05 jQuery
Python的Scrapy爬虫框架简单学习笔记
2016/01/20 Python
详解Python3的TFTP文件传输
2018/06/26 Python
Python中的单行、多行、中文注释方法
2018/07/19 Python
python之mock模块基本使用方法详解
2019/06/27 Python
Python3中的最大整数和最大浮点数实例
2019/07/09 Python
python虚拟环境完美部署教程
2019/08/06 Python
python数据库开发之MongoDB安装及Python3操作MongoDB数据库详细方法与实例
2020/03/18 Python
企业后勤岗位职责
2014/02/28 职场文书
《社戏》教学反思
2014/04/15 职场文书
2014年创先争优工作总结
2014/12/11 职场文书
PyTorch 如何自动计算梯度
2021/05/23 Python