JS获取地址栏参数&jquery
程序员文章站
2022-05-28 14:03:50
第一种:字符串拆分法 window.location.href 或者 location.href 或者 window.location 获得地址栏中的所有内容 decodeURI()可以解码地址栏中的数据 恢复中文数据 window.search 获得地址栏中问号及问号之后的数据 第二种:正则匹配法 ......
第一种:字符串拆分法
window.location.href 或者 location.href 或者 window.location 获得地址栏中的所有内容
decodeuri()可以解码地址栏中的数据 恢复中文数据
window.search 获得地址栏中问号及问号之后的数据
1 //获取地址栏里(url)传递的参数 2 function getrequest(value) { 3 //url例子:www.bicycle.com?id="123456"&name="bicycle"; 4 var url = decodeuri(location.search); //?id="123456"&name="bicycle"; 5 var object = {}; 6 if(url.indexof("?") != -1)//url中存在问号,也就说有参数。 7 { 8 var str = url.substr(1); //得到?后面的字符串 9 var strs = str.split("&"); //将得到的参数分隔成数组[id="123456",name="bicycle"]; 10 for(var i = 0; i < strs.length; i ++) 11 { 12 object[strs[i].split("=")[0]]=strs[i].split("=")[1] 13 } 14 } 15 return object[value]; 16 }
第二种:正则匹配法
这种方法其实原理和上一种方法类似,都是从url中提取,只是提取的方法不同而已。
1 function getquerystring(name) { 2 var reg = new regexp("(^|&)" + name + "=([^&]*)(&|$)"); 3 var r = window.location.search.substr(1).match(reg); 4 if (r != null) { 5 return unescape(r[2]); 6 } 7 return null; 8 }
思维拓展:
有一个select标签
获取地址栏参数,把选中option内容加到地址栏后面
1 <!doctype html> 2 <html> 3 4 <head> 5 <meta charset="utf-8" /> 6 <script src="jquery.min.js"></script> 7 <script> 8 function func() { 9 var vs = $('select option:selected').val(); 10 alert(vs) 11 } 12 </script> 13 </head> 14 15 <body> 16 <select onchange="func()"> 17 <option value="1">一月</option> 18 <option value="2">二月</option> 19 <option value="3">三月</option> 20 <option value="4">四月</option> 21 </select> 22 </div> 23 </body> 24 25 </html>
这一步的目的是获取选中option的值(各位在引用jquery包的之后要记住别忘了再加script标签, 刚写了好几种版本一顿报错。。。。最后发现是标签。。。。。)
在后面就好写了 照着上面获取url参数,自己造一个参数,怼进去就完事了
接下来复习下jquery
首先就是初始化方法 ,我脑子不太灵光,每隔一段时间肯定会忘掉,然后百度搜,记住,在忘掉。。。。
第一种: $(document).ready(function(){ xxxxxxxxx }); 第二种: $(function(){ xxxxxxxxx }); 第三种: jquery(function($){ xxxxxxxxx });
再就是最基本的选择器
class用"." id用“#”
jquery极大地提高了编码效率,替代了js中document.getelementbyxxx之类的笨重方法
不过在使用jquery的时候要记住不要出现重复的class或者id(除非你是故意的)
还有 一个标签可以定义多个class
就像这样:
1 <div class="a b c"></div>
中间用空格隔开。
在就没啥可说的了,md写困了,等有力气了再把我个人用的不太熟练的jquery方法记录下来
那今天就到这里了 下期再见!
下一篇: Android 极光推送别名与标签方式