浅谈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 相关文章推荐
[JS]点出统计器
Oct 11 Javascript
基于逻辑运算的简单权限系统(实现) JS 版
Mar 24 Javascript
javascritp实现input输入框相关限制用法
Jun 29 Javascript
JavaScript replace(rgExp,fn)正则替换的用法
Mar 04 Javascript
jQuery数据缓存功能的实现思路及简单模拟
May 27 Javascript
JavaScript验证电子邮箱的函数
Aug 22 Javascript
JavaScript实现输入框与清空按钮联动效果
Sep 09 Javascript
基于Vue过渡状态实例讲解
Sep 14 Javascript
详解微信小程序调用支付接口支付
Apr 28 Javascript
Vue监听页面刷新和关闭功能
Jun 20 Javascript
微信小程序嵌入腾讯视频源过程详解
Aug 08 Javascript
如何实现vue的tree组件
Dec 03 Vue.js
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实现用于删除整个目录的递归函数
2015/03/16 PHP
PHP实现简单爬虫的方法
2015/07/29 PHP
php 替换文章中的图片路径,下载图片到本地服务器的方法
2018/02/06 PHP
use jscript List Installed Software
2007/06/11 Javascript
5款Javascript颜色选择器
2009/10/25 Javascript
FileUpload 控件 禁止手动输入或粘贴的实现代码
2010/04/07 Javascript
js点击事件链接的问题解决
2014/04/25 Javascript
node.js中的fs.lchown方法使用说明
2014/12/16 Javascript
nodejs实现HTTPS发起POST请求
2015/04/23 NodeJs
使用AngularJS中的SCE来防止XSS攻击的方法
2015/06/18 Javascript
Boostrap入门准备之border box
2016/05/09 Javascript
JS实现的多张图片轮流播放幻灯片效果
2016/07/22 Javascript
jQuery插件Easyui设置datagrid的pageNumber导致两次请求问题的解决方法
2016/08/06 Javascript
JavaScript实现点击按钮复制指定区域文本(推荐)
2016/11/25 Javascript
js实现本地图片文件拖拽效果
2017/07/18 Javascript
vuex + axios 做登录验证 并且保存登录状态的实例
2018/09/16 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
2018/12/28 Javascript
ElementUI Tag组件实现多标签生成的方法示例
2019/07/08 Javascript
解决layUI的页面显示不全的问题
2019/09/20 Javascript
Openlayers实现图形绘制
2020/09/28 Javascript
vue实现简易的双向数据绑定
2020/12/29 Vue.js
Python读取图片EXIF信息类库介绍和使用实例
2014/07/10 Python
Python深入学习之闭包
2014/08/31 Python
python自动格式化json文件的方法
2015/03/11 Python
Python使用PyQt5/PySide2编写一个极简的音乐播放器功能
2020/02/07 Python
Python MOCK SERVER moco模拟接口测试过程解析
2020/04/13 Python
使用CSS3的box-sizing属性解决div宽高被内边距撑开的问题
2016/06/28 HTML / CSS
美国祛痘、抗衰老药妆品牌:Murad
2016/08/27 全球购物
找到您丢失的钥匙、钱包和手机:Tile
2017/05/19 全球购物
大学生的网络创业计划书
2013/12/26 职场文书
大四优秀党员个人民主评议
2014/09/19 职场文书
表扬信格式模板
2015/05/05 职场文书
2021-4-3课程——SQL Server查询【2】
2021/04/05 SQL Server
Python 语言实现六大查找算法
2021/06/30 Python
「魔法少女伊莉雅」美游粘土人开订
2022/03/21 日漫
Python使用MapReduce进行简单的销售统计
2022/04/22 Python