使用JavaScript获取Request中参数的值方法


Posted in Javascript onSeptember 27, 2016

假设现在有一个URL,如下。

https://3water.com

如何通过JS访问到id和name里面的值呢,实现我们来分析一下思路。

先获取当前页面的URL,通过window.location.href。

提取该URL?后面的部分,通过slice()方法。

把获取到的Request对象分割成字符串数组,通过split() 方法。

接下来看代码。

function getUrlVars() {
  var vars = [],
    hash;
  var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
  for (var i = 0; i < hashes.length; i++) {
    hash = hashes[i].split('=');
    vars.push(hash[0]);
    vars[hash[0]] = hash[1];
  }
  return vars;
}

接下来就是获取指定参数的值了,代码如下。

var id = getUrlVars()["id"]; 
var name = getUrlVars()["name"];

最后,我们再看看jQuery的写法。

$.extend({
  getUrlVars: function() {
    var vars = [],
      hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name) {
    return $.getUrlVars()[name];
  }
});
var id = $.getUrlVar('id');
var name = $.getUrlVar('name');

以上就是小编为大家带来的使用JavaScript获取Request中参数的值方法的全部内容了,希望对大家有所帮助,多多支持三水点靠木~

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(4)
Dec 23 Javascript
Javascript下IE与Firefox下的差异兼容写法总结
Jun 18 Javascript
node.js中的fs.writeSync方法使用说明
Dec 15 Javascript
JavaScript中的this关键字使用详解
Aug 14 Javascript
JavaScript实现上下浮动的窗口效果代码
Oct 12 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
Dec 28 Javascript
JS实现按钮控制计时开始和停止功能
Jul 27 Javascript
js实现简单数字变动效果
Nov 06 Javascript
AngularJS中的作用域实例分析
May 16 Javascript
微信小程序scroll-view实现滚动穿透和阻止滚动的方法
Aug 20 Javascript
Javascript中parseInt的正确使用方式
Oct 17 Javascript
使用Phantomjs和Node完成网页的截屏快照的方法
Jul 16 Javascript
详解JavaScript权威指南之对象
Sep 27 #Javascript
Web性能优化系列 10个提升JavaScript性能的技巧
Sep 27 #Javascript
JS点击某个图标或按钮弹出文件选择框的实现代码
Sep 27 #Javascript
ReactNative页面跳转实例代码
Sep 27 #Javascript
JS控制HTML元素的显示和隐藏的两种方法
Sep 27 #Javascript
js仿支付宝多方框输入支付密码效果
Sep 27 #Javascript
jQuery实现右键菜单、遮罩等效果代码
Sep 27 #Javascript
You might like
ubuntu12.04使用c编写php扩展模块教程分享
2013/12/25 PHP
PHP取余函数介绍MOD(x,y)与x%y
2014/05/15 PHP
PHP图片加水印实现方法
2016/05/06 PHP
php简单实现单态设计模式的方法分析
2017/07/28 PHP
jquery 操作日期、星期、元素的追加的实现代码
2012/02/07 Javascript
如何将一个String和多个String值进行比较思路分析
2013/04/22 Javascript
原始XMLHttpRequest方法详情回顾
2013/11/28 Javascript
Javascript节点关系实例分析
2015/05/15 Javascript
JavaScript中几种排序算法的简单实现
2015/07/29 Javascript
javascript与jquery动态创建html元素示例
2016/07/25 Javascript
微信小程序 Video API实例详解
2016/10/02 Javascript
Express URL跳转(重定向)的实现方法
2017/04/07 Javascript
Angularjs的键盘事件的绑定
2017/07/27 Javascript
vue实现留言板todolist功能
2017/08/16 Javascript
详解vue2 $watch要注意的问题
2017/09/08 Javascript
详解如何实现一个简单的 vuex
2018/02/10 Javascript
JQuery中DOM节点的操作与访问方法实例分析
2019/12/23 jQuery
vue-cli设置css不生效的解决方法
2020/02/07 Javascript
jQuery实现的解析本地 XML 文档操作示例
2020/04/30 jQuery
python网络编程之UDP通信实例(含服务器端、客户端、UDP广播例子)
2014/04/25 Python
tensorflow实现逻辑回归模型
2018/09/08 Python
Python过滤txt文件内重复内容的方法
2018/10/21 Python
浅谈Python 递归算法指归
2019/08/22 Python
Python字节单位转换实例
2019/12/05 Python
Under Armour澳大利亚官网:美国知名的高端功能性运动品牌
2018/02/22 全球购物
SNIDEL官网:日本VIVI杂志人气少女第一品牌
2020/03/12 全球购物
师范生自荐信范文
2013/10/06 职场文书
司机辞职报告范文
2014/01/20 职场文书
银行工作检查书范文
2014/01/31 职场文书
一份关于丢失公司财物的检讨书
2014/09/19 职场文书
2015年教师新年寄语
2014/12/08 职场文书
销售区域经理岗位职责
2015/04/10 职场文书
消防演习感想
2015/08/10 职场文书
详细聊聊Oracle表碎片对性能有多大的影响
2022/03/19 Oracle
关于Redis的主从复制及哨兵问题
2022/06/16 Redis
html解决浏览器记住密码输入框的问题
2023/05/07 HTML / CSS