JS获取和修改url参数
# JS获取和修改url参数
# 获取url参数
/**
* 获取url里的参数
* @param arg 参数名
* @returns
*/
function getURLString(arg) {
var reg = new RegExp("(^|&)" + arg + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null)
return unescape(r[2]);
return null;
}
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
# 修改url参数
/**
* url地址修改
* @param url 待修改url
* @param arg 修改的参数名
* @param arg_val 修改的具体值
* @returns {String}
*/
function changeURLArg(url, arg, arg_val) {
var pattern = arg + '=([^&]*)';
var replaceText = arg + '=' + arg_val;
if (url.match(pattern)) {
var tmp = '/(' + arg + '=)([^&]*)/gi';
tmp = url.replace(eval(tmp), replaceText);
return tmp;
} else {
if (url.match('[\?]')) {
return url + '&' + replaceText;
} else {
return url + '?' + replaceText;
}
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# 不刷新页面修改url参数
https://www.cnblogs.com/wuting/p/8946927.html (opens new window)
# URL 的编码和解码
比如，UTF-8 的操作系统上，http://www.example.com/q=春节这个 URL 之中，汉字“春节”不是 URL 的合法字符，所以被浏览器自动转成http://www.example.com/q=%E6%98%A5%E8%8A%82。其中，“春”转成了%E6%98%A5，“节”转成了%E8%8A%82。这是因为“春”和“节”的 UTF-8 编码分别是E6 98 A5和E8 8A 82，将每个字节前面加上百分号，就构成了 URL 编码。
JavaScript 提供四个 URL 的编码/解码方法。
encodeURI()encodeURIComponent()decodeURI()decodeURIComponent()
# encodeURI和encodeURIComponent区别
encodeURI方法不会对下列字符编码 ASCII字母 数字 ~!@#$&*()=:/,;?+'
encodeURIComponent方法不会对下列字符编码 ASCII字母 数字 ~!*()'
所以encodeURIComponent比encodeURI编码的范围更大。
- 如果你需要编码整个URL，然后需要使用这个URL，那么用encodeURI
比如：
encodeURI("http://www.cnblogs.com/season-huang/some other thing");
编码后会变成：
"http://www.cnblogs.com/season-huang/some%20other%20thing";
其中，空格被编码成了%20。但是如果你用了encodeURIComponent，那么结果变为
"http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2Fsome%20other%20thing"
看到了区别吗，连 "/" 都被编码了，整个URL已经没法用了。
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
- 当你需要编码URL中的参数的时候，那么encodeURIComponent是最好方法
var param = "http://www.cnblogs.com/season-huang/"; //param为参数
param = encodeURIComponent(param);
var url = "http://www.cnblogs.com?next=" + param;
console.log(url)
结果为："http://www.cnblogs.com?next=http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2F"
1
2
3
4
5
6
2
3
4
5
6
Last Updated: 2024/05/10, 20:24:36