Js+Jq获取URL参数的集中方法示例代码


Posted in Javascript onMay 20, 2014

JQ取值方法:

jquery本身也不存在取得URL参数的方法,但是已经存在插件,可以直接取得URL等参数
插件连接主页:https://github.com/allmarkedup/jQuery-URL-Parser
下载链接:http://download.github.com/allmarkedup-jQuery-URL-Parser-bb2bf37.zip

Examples of use
Using the current page's url (for these examples https://mysite.com/information/about/index.html?itemID=2&user=dave):

// get the protocol
jQuery.url.attr("protocol") // returns 'http'

// get the path
jQuery.url.attr("path") // returns '/information/about/index.html'

// get the host
jQuery.url.attr("host") // returns 'mysite.com'

// get the value for the itemID query parameter
jQuery.url.param("itemID") // returns 2

// get the second segment from the url path
jQuery.url.segment(2) // returns 'about'
Using a different url to the current page:

// set a different URL and return the anchor string
jQuery.url.setUrl("http://allmarkedup.com/category/javascript/#footer").attr("anchor") // returns 'footer'

JS原生获取:

最原始的JS方法:

var URLParams = new Array(); 
var aParams = document.location.search.substr(1).split('&'); 
for (i=0; i < aParams.length ; i++){ 
var aParam = aParams[i].split('='); 
URLParams[aParam[0]] = aParam[1]; 
}

这样调用:

http://127.0.0.1/index.php?name=name1&cid=123
//取得传过来的name参数
name=URLParams["name"];

document.write(name);
//取得传过来的cid

cid=URLParams["cid"];

正则分析法:

方法一:

function getQueryString(name) { 
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); 
var r = window.location.search.substr(1).match(reg); 
if (r != null) return unescape(r[2]); return null; 
}

这样调用:

alert(GetQueryString("参数名1")); alert(GetQueryString("参数名2")); 
alert(GetQueryString("参数名3"));

方法二:
<span style="font-size: 16px;"><Script language="javascript"> 
function GetRequest() { 
var url = location.search; //获取url中"?"符后的字串 
var theRequest = new Object(); 
if (url.indexOf("?") != -1) { 
var str = url.substr(1); 
strs = str.split("&"); 
for(var i = 0; i < strs.length; i ++) { 
theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]); 
} 
} 
return theRequest; 
} 
</Script>

这样调用:
<Script language="javascript"> 
var Request = new Object(); 
Request = GetRequest(); 
var 参数1,参数2,参数3,参数N; 
参数1 = Request['参数1']; 
参数2 = Request['参数2']; 
参数3 = Request['参数3']; 
参数N = Request['参数N']; 
</Script>
Javascript 相关文章推荐
获取Javscript执行函数名称的方法
Dec 22 Javascript
json格式化/压缩工具 Chrome插件扩展版
May 25 Javascript
jquery小火箭返回顶部代码分享
Aug 19 Javascript
详述JavaScript实现继承的几种方式(推荐)
Mar 22 Javascript
AngularJS 所有版本下载地址
Sep 14 Javascript
AngularJS使用ng-Cloak阻止初始化闪烁问题的方法
Nov 03 Javascript
Angularjs通过指令监听ng-repeat渲染完成后执行脚本的方法
Dec 31 Javascript
webpack分离css单独打包的方法
Jun 12 Javascript
vue自定义tap指令及tap事件的实现
Sep 18 Javascript
JS使用数组实现的队列功能示例
Mar 04 Javascript
Angular4.0动画操作实例详解
May 10 Javascript
详解Howler.js Web音频播放终极解决方案
Aug 23 Javascript
js 采用delete实现继承示例代码
May 20 #Javascript
js清空form表单中的内容示例
May 20 #Javascript
Javascript 函数parseInt()转换时出现bug问题
May 20 #Javascript
JavaScript中this关键词的使用技巧、工作原理以及注意事项
May 20 #Javascript
Jquery插件分享之气泡形提示控件grumble.js
May 20 #Javascript
实现网页页面跳转的几种方法(meta标签、js实现、php实现)
May 20 #Javascript
jQuery.holdReady()使用方法
May 20 #Javascript
You might like
php通过strpos查找字符串出现位置的方法
2015/03/17 PHP
Codeigniter校验ip地址的方法
2015/03/21 PHP
php类的扩展和继承用法实例
2015/06/20 PHP
Yii 2.0中场景的使用教程
2017/06/02 PHP
jQuery之日期选择器的深入解析
2013/06/19 Javascript
JS实现仿Windows7风格的网页右键菜单效果代码
2015/09/11 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
微信小程序 swiper组件详解及实例代码
2016/10/25 Javascript
详解AngularJS验证、过滤器、指令
2017/01/04 Javascript
JQuery中Ajax的操作完整例子
2017/03/07 Javascript
js Element Traversal规范中的元素遍历方法
2018/04/19 Javascript
layui实现动态和静态分页
2018/04/28 Javascript
vue.js通过路由实现经典的三栏布局实例代码
2018/07/08 Javascript
JS使用正则表达式判断输入框失去焦点事件
2019/10/16 Javascript
uniapp,微信小程序中使用 MQTT的问题
2020/07/11 Javascript
javascript自定义加载loading效果
2020/09/15 Javascript
vue 使用 v-model 双向绑定父子组件的值遇见的问题及解决方案
2021/03/01 Vue.js
[01:02:32]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第二场 2月26日
2021/03/11 DOTA
python原始套接字编程示例分享
2014/02/21 Python
Python 文件读写操作实例详解
2014/03/12 Python
Python入门_浅谈for循环、while循环
2017/05/16 Python
python Pandas如何对数据集随机抽样
2019/07/29 Python
Python实现图片裁剪的两种方式(Pillow和OpenCV)
2019/10/30 Python
使用pytorch和torchtext进行文本分类的实例
2020/01/08 Python
python3 配置logging日志类的操作
2020/04/08 Python
python制作微博图片爬取工具
2021/01/16 Python
CSS 说明横向进度条最后显示文字的实现代码
2020/11/10 HTML / CSS
浅谈HTML5新增和废弃的标签
2019/04/28 HTML / CSS
预订奥兰多和佛罗里达州公园门票:FloridaTix
2018/01/03 全球购物
美体小铺瑞典官方网站:The Body Shop瑞典
2018/01/27 全球购物
opencv实现图像几何变换
2021/03/24 Python
自我鉴定怎么写
2013/12/05 职场文书
副校长竞聘演讲稿
2014/09/01 职场文书
敬老院志愿者活动总结
2015/05/06 职场文书
同意报考公务员证明
2015/06/17 职场文书
五年级作文之学校的四季
2019/12/05 职场文书