鱼C论坛

 找回密码
 立即注册
查看: 2491|回复: 9

[每日一练] 技法77 (◐‿◑) 获取地址栏URL参数 | 【甜蜜】

[复制链接]
发表于 2017-11-4 11:34:02 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能^_^

您需要 登录 才可以下载或查看,没有账号?立即注册

x
本帖最后由 不二如是 于 2017-11-4 11:34 编辑


                               
登录/注册后可看大图


按照提示,完成代码,秀秀你的编程能力!

不许看答案,否则打屁屁





分析:
        在Js中经常要获取URL的参数来执行不同的业务。例如:在一些Web服务中,通过URL中的”?userID=1“来显示不同的网页,像微博就是通过“ /u/用户ID编号”的组合形式来访问不同的个人空间。
        ?,起到触发作用(只写一次)
        &,连接不同参数
11月-04-2017 11-25-02.gif


   





Code

HTML:
  1. <h2>获取地址栏URL的参数</h2>
  2.     <p id='getURLArgs'></p>
复制代码


JS:
  1. <script type="text/javascript">
  2.     window.onload = function(){

  3.         function getURLArgs(e){// 获取地址栏URL的参数
  4.             var args = "空",//试着在浏览器添加参数
  5.                     _args = [];
  6.             u = window.location.href,
  7.                     s = u.indexOf("?"),
  8.                     i = 0,
  9.                     l = 0,
  10.                     o = null;

  11.             if(s != -1){//如果不等于-1则存在参数
  12.                 args = u.substr(s+1).split("&");
  13.             }
  14.             e. innerHTML = "参数会以逗号分隔:" + args;
  15.             l = args.length;
  16.             for(; i < l; i++){
  17.                 if(args[i]){
  18.                     o = args[i].split("=");
  19.                     //相同的参数以后边添加的参数为主,会覆盖前面的参数
  20.                     _args[o[0]] = o[1];
  21.                 }
  22.             }

  23.             console.log(_args);//打印参数列表
  24.             return _args;
  25.         }
  26.         //获取地址栏URL的参数
  27.         getURLArgs(document.getElementById("getURLArgs"));
  28.     };
  29. </script>
复制代码





请按照自己的理解订正对概念的认知


代码说明(秀智商
游客,如果您要查看本帖隐藏内容请回复





回顾:






源代码: 77.zip (909 Bytes, 下载次数: 4, 售价: 6 鱼币)





如果喜欢,请订阅


如果喜欢,别忘了评分


                               
登录/注册后可看大图

本帖被以下淘专辑推荐:

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2018-7-17 17:36:42 | 显示全部楼层
  查看一下
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-7-18 17:06:20 | 显示全部楼层
  1.         window.onload = function(){
  2.                                 var oInput = document.getElementsByTagName("input")[0];
  3.                                 oInput.onclick = function(){
  4.                                         var str = window.location.href;
  5.                                         var n = str.indexOf("?");
  6.                                         if(n == -1){
  7.                                                 alert("参数不存在");
  8.                                                 return;
  9.                                         }
  10.                                         str = str.substr(n+1);
  11.                                         var s= "";
  12.                                         var arr = str.split("&");
  13.                                         for(var i = 0; i < arr.length; i++){
  14.                                                 var a = arr[i].split("=");
  15.                                                 s += "参数"
  16.                                                 s += a[0];
  17.                                                 s += ":";
  18.                                                 s += a[1]+"    ";
  19.                                         }
  20.                                        
  21.                                         alert(s);
  22.                                
  23.                                 }
  24.                         };
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-8-9 15:49:36 | 显示全部楼层
对URL的理解不是很好,需要注解
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-9-18 09:19:55 | 显示全部楼层
没看懂....
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-9-20 13:06:44 | 显示全部楼层
emmm
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2019-4-14 15:53:36 | 显示全部楼层
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2019-11-12 20:10:14 | 显示全部楼层
甜蜜
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2023-9-22 11:39:43 | 显示全部楼层
1
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2023-11-13 14:07:26 | 显示全部楼层
1
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-3-28 21:20

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表