前台使用JavaScript或者JQuery来获取当前url(页面)地址参数是我们经常需要用到的操作,这里我分享如何分别通过JavaScript和JQuery来获取url参数。

获取当前页面地址
1 |
window.location.href;<br> |
通过上面你的方法就可以很方便的获取当前页面的地址。
通过JavaScript获取参数
获取到页面地址以后我们需要对地址中的参数进行操作,这里使用JavaScript的方式来获取
1 2 3 4 5 6 |
//JavaScript获取url中的参数 function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象 var r = window.location.search.substr(1).match(reg); //匹配目标参数 if (r != null) return unescape(r[2]); return null; //返回参数值 } |
通过这个函数传递url中的参数名就可以获取到参数的值,比如url为
我们要获取reurl的值,可以这样写:
1 |
var result= getUrlParam('reurl');<br> |
通过JQuery获取参数
明白了JavaScript的获取方式以后,这里我们扩展一个JQuery版本
1 2 3 4 5 6 7 |
(function ($) { $.getUrlParam = function (name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } })(jQuery); |
使用方法:
1 |
var xx = $.getUrlParam('reurl');<br> |
最后总结
下面我们将2个方法做一个总结
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { //JQuery 方式获取参数 (function ($) { $.getUrlParam = function (name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } })(jQuery); //JQuery 方式获取参数 var xx = $.getUrlParam('reurl'); ///JavaScript 方式获取参数 // var xx = getUrlParam('reurl'); alert(xx); }); //JavaScript 方式获取参数 function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象 var r = window.location.search.substr(1).match(reg); //匹配目标参数 if (r != null) return unescape(r[2]); return null; //返回参数值 } </script> |
发布者:柚子,转转请注明出处:https://ityouzi.com/archives/get-url-param-javascript-jquery.html