一．<script> urlinfo=window.location.href; //获取当前页面的url len=urlinfo.length;//获取url的长度 offset=urlinfo.indexOf("?");//设置参数字符串开始的位置 newsidinfo=urlinfo.substr(offset,len)//取出参数字符串 这里会获得类似“id=1”这样的字符串 newsids=newsidinfo.split("=");//对获得的参数字符串按照“=”进行分割 newsid=newsids[1];//得到参数值 alert("您要传递的参数值是"+newsid); < /script>

二．更好的方法： 声明一个queryString函数 <script type="text/javascript"> Request = { QueryString : function(item){ var svalue = location.search.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)","i")); return svalue ? svalue[1] : svalue; } } < /script>

使用的时候像java一样调用就行了： <script type="text/javascript"> document.write( Request.QueryString("name") ); < /script>

下面是另种方法:

本文原理是使用正则表达式匹配location.search中的字符串。其中三个主要函数为 getQueryString()、getQueryStringByName(name)和getQueryStringByIndex(index)

三个主要方法：

方法

说明

getQueryString

获取QueryString的数组。

例如路径QueryStringDemo.html?id=5&type=1&flag=0

调用后返回["id=5", "type=1", "flag=0"]

getQueryStringByName

根据QueryString参数名称获取值

getQueryStringByIndex

根据QueryString参数索引获取值
复制代码 代码如下:
//获取QueryString的数组  function getQueryString(){  var result = location.search.match(new RegExp("[\?\&][^\?\&]+=[^\?\&]+","g"));  for(var i = 0; i < result.length; i++){  result[i] = result[i].substring(1);  }  return result;  }  //根据QueryString参数名称获取值  function getQueryStringByName(name){  var result = location.search.match(new RegExp("[\?\&]" + name+ "=([^\&]+)","i"));  if(result == null || result.length < 1){  return "";  }  return result[1];  }  //根据QueryString参数索引获取值  function getQueryStringByIndex(index){  if(index == null){  return "";  }  var queryStringList = getQueryString();  if (index >= queryStringList.length){  return "";  }  var result = queryStringList[index];  var startIndex = result.indexOf("=") + 1;  result = result.substring(startIndex);  return result;  } 

测试页面路径：QueryStringDemo.html?id=5&type=1&flag=0  页面加载时：  在QueryString's name后的文本框中输入要获取的QueryString的名称获取相应的值：  在QueryString's index后的文本框中输入要获取的QueryString的索引获取相应的值（索引从0开始）：  这样就可以在页面中方便的获取QueryString的值了。最后附上测试页面QueryStringDemo.html的源代码：

复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">  <head>  <meta content="text/html; charset=gb2312" http-equiv="Content-Type" />  <title>QueryString获取演示代码 www.jb51.net</title>  <script type="text/javascript">  //获取QueryString的数组  function getQueryString(){  var result = location.search.match(new RegExp("[\?\&][^\?\&]+=[^\?\&]+","g"));  for(var i = 0; i < result.length; i++){  result[i] = result[i].substring(1);  }  return result;  }  //根据QueryString参数名称获取值  function getQueryStringByName(name){  var result = location.search.match(new RegExp("[\?\&]" + name+ "=([^\&]+)","i"));  if(result == null || result.length < 1){  return "";  }  return result[1];  }  //根据QueryString参数索引获取值  function getQueryStringByIndex(index){  if(index == null){  return "";  }  var queryStringList = getQueryString();  if (index >= queryStringList.length){  return "";  }  var result = queryStringList[index];  var startIndex = result.indexOf("=") + 1;  result = result.substring(startIndex);  return result;  }  //绑定当控件高亮选中时，点击“回车键”时执行的操作  //control：要绑定事件的控件  //func：要执行的方法  function bindEnterEvent(control, func){  control.onkeypress = function(){  if (event.keyCode == 13){  func();  }  }  }  //根据输入的QueryString名称获取值  function getByName(){  var name = document.getElementById("txtQueryStringName").value;  document.getElementById("txtResult").innerHTML = getQueryStringByName(name);  }  //根据输入的QueryString的索引获取值  function getByIndex(){  var index = document.getElementById("txtQueryStringIndex").value;  document.getElementById("txtResult").innerHTML = getQueryStringByIndex(index);  }  </script>  </head>  <body>  <div>  <span>QueryString : </span><span id="queryString"></span>  </div>  <div>  <span>QueryString's name : </span>  <input id="txtQueryStringName" name="txtQueryStringName" type="text" />  <input name="btnGetByName" type="button" value="获取" onclick="getByName()" />  </div>  <div>  <span>QueryString's index : </span>  <input id="txtQueryStringIndex" name="txtQueryStringIndex" type="text" />  <input name="btnGetByIndex" type="button" value="获取" onclick="getByIndex()" />  </div>  <div>  <span>结果 ：</span><span id="txtResult"></span>  </div>  <!--页面加载时执行的操作-->  <script type="text/javascript">  //显示所有QueryString  document.getElementById("queryString").innerHTML = getQueryString();  //为txtQueryStringName绑定回车事件  bindEnterEvent(txtQueryStringName, getByName);  //为txtQueryStringIndex绑定回车事件  bindEnterEvent(txtQueryStringIndex, getByIndex);  </script>  </body>  </html> 

使用js获取QueryString的方法小结的更多相关文章

  1. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  2. js获取域名的方法

    本文实例讲述了js获取域名的方法.分享给大家供大家参考.具体实现方法如下: 复制代码代码如下: <script>//获取域名var k_host = window.location.hos ...

  3. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  4. 【功能代码】---4用JS获取地址栏参数方法

    用JS获取地址栏参数方法 // 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new Reg ...

  5. 使用JS获取当前地理位置方法汇总

    使用JS获取当前地理位置方法汇总 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2014-12-18我要评论 这篇文章主要介绍了使用JS获取当前地理位置方法汇总,需要的朋友可以参考下 ...

  6. js面向对象 多种创建对象方法小结

    转自js面向对象 多种创建对象方法小结 1.对象字面量 var clock={ hour:12, minute:10, second:10, showTime:function(){ alert(th ...

  7. 【JS】---4用JS获取地址栏参数方法

    用JS获取地址栏参数方法 // 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new Reg ...

  8. js 获取小数点位数方法及 字符串与数字之间相互转换方法

    1.获取小数点位数方法 a. 使用 js 中 subsrting,indexOf,parseFloat三个函数,代码如下: var s = "22.127456" ;//s 为 字 ...

  9. js获取IP地址方法总结_转

    js代码获取IP地址的方法,如何在js中取得客户端的IP地址.原文地址:js获取IP地址的三种方法 http://www.jbxue.com/article/11338.html 1,js取得IP地址 ...

随机推荐

  1. Django ORM OneToOneField

    一对一关系 一对一关系与多对一关系非常相似.如果你在模型中定义一个OneToOneField,该模型的实例将可以通过该模型的一个简单属性访问关联的模型. class Person(models.Mod ...

  2. POJ1487 Single-Player Games 高斯消元

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - POJ1487 题解概括 给出多个树形结构,由小写字母和数字表示,每个小写字母表示一棵小树.现在,以a为根节点 ...

  3. 【Java】 剑指offer(3) 二维数组中的查找

    本文参考自<剑指offer>一书,代码采用Java语言. 更多:<剑指Offer>Java实现合集 题目 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都按照从上 ...

  4. Burp Suite之截断代理功能及相关设置（一）

    Burpsuite 1.burpsuite 简介2.设置代理3.Target4.爬网模块5.扫描模块6.扩展模块7.intrude8.Repeater9.Sequencer10.Decoder11.C ...

  5. 李宏毅机器学习笔记2：Gradient Descent(附带详细的原理推导过程）

    李宏毅老师的机器学习课程和吴恩达老师的机器学习课程都是都是ML和DL非常好的入门资料,在YouTube.网易云课堂.B站都能观看到相应的课程视频,接下来这一系列的博客我都将记录老师上课的笔记以及自己对 ...

  6. go语言学习-安装和配置

    go的安装方式主要有两种,一种直接使用系统自带的软件源来安装,比如 ubuntu 可以直接使用 apt 安装,但通常这种方式安装的都不会是最新的.所以通常直接下载最新的安装包,可以到GoCN下载.下面 ...

  7. Window环境下，PHP调用Python脚本

    参考 php调用python脚本*** php 调用 python脚本的方法 解决办法:php提供了许多调用其他脚本或程序的方法,比如exec/system/popen/proc_open/passt ...

  8. 关于文档模式、DCOTYPE声明及严格模式

    1.文档模式 文档模式的概念是由IE5.5引入,通过使用文档类型(DOCTYPE)切换实现的.不同的文档模式主要影响CSS内容的呈现,尤其是浏览器对盒模型的解析,但在某些情况下也会影响到JavaScr ...

  9. python urllib2对http的get，put，post，delete

    #GET: #!/usr/bin/env python# -*- coding:utf-8 -*-import urllib2def get():    URL = 'www.baidu.com'  ...

  10. loj#2574. 「TJOI2018」智力竞赛 (路径覆盖)

    目录 题目链接 题解 代码 题目链接 loj#2574. 「TJOI2018」智力竞赛 题解 就是求可重路径覆盖之后最大化剩余点的最小权值 二分答案后就是一个可重复路径覆盖 处理出可达点做二分图匹配就 ...