js 通过url获取里面的参数值
场景描述:当我们从一个页面要带有一两个值跳转到另一个页面,另一个页面要使用这些参数的时候,我们就需要通过js获取这些参数啦。
先贴上代码:
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; }
这里我们使用正则,通过找到 ‘name’ ,然后获取我们需要的参数。这里的name就是你传过来的(例如:id,userName之类的都可以)。
下面我们具体讲一下:
reg:(这个是reg的结果,id是我传过来的)
/(^|&)id=([^&]*)(&|$)/i
r: (这里打印出来的是一个数组,你可以自己选择符合我们自己需求的来使用。这里我需要用到它的值,所以取 r[2])
["id=10", "", "10", "", index: 0, input: "id=10"]
调用的时候只需要这样使用:
getQueryString("id")//这里我需要获取url里面的id的值
正常情况以上方法可以实现需求,但是有一种情况上面方式行不通。
vue 的路由包含#号的情况下,我们只用通过另外一种方式实现:
function getQueryString (name) { /* eslint-disable */ return decodeURIComponent((new RegExp('[?|&]'+name+'='+'([^&;]+?)(&|#|;|$)').exec(location.href)||[, ''])[1].replace(/\+/g, '%20')) || null /* eslint-enable */ }
调用的时候:
getQueryString('id') // 这里我需要获取url里面的id的值