如何获取浏览器URL中查询字符串的参数?

想要知道怎样解决这个问题,首先我们先认识一下Location对象

Location对象包含了当前页面与位置(url)相关的信息

URL示例:http://www.baidu.com:80/news/index.aspx?id=1&name=location#top

Location对象共定义了8个属性

href:声明了当前显示文档的完整的URL

protocol:声明URL的协议部分,包括后缀的冒号,例如http:

host:声明当前URL的主机名和端口号(是hostname和port的合集),例如www.baidu.com:80

hostname:声明当前URL的主机名,例如www.baidu.com

port:声明当前URL的端口部分,例如80

pathname:声明当前URL的路径部分,例如news/index.aspx

search:声明当前URL的查询部分,例如?id=1&name=localhost

hash:声明当前URL的锚的部分,例如#top,指定在文档中的锚记的名称

Location对象的这些属性都是可读可写的,如果改变了文档的location.href,则浏览器会载入新的页面。同样如果改变了location.hash,则页面会跳转到新的锚点,但此时页面不会重载。

想必大家会想,这个与link对象的url属性类似啊,不过link对象表示的是文档中的超链接,而Location对象表示的是浏览器当前显示文档的url。

当然,Location对象还有两个方法:reload()和replace()

reload():可以重新装载当前文档

replace():可以装载一个新文档而无须为它创建一个新的历史记录。也就是说,在浏览器的历史列表中,新文档将替换当前文档。这样就不能通过【返回】按钮返回当前文档了。

通过将url字符串信息赋值给窗口的location属性来装载新文档,可以实现返回浏览。

对那些使用了框架而且显示多个临时也的网站来说,replace()方法比较有用,这样临时页面都不被存储在历史列表中。

注意:

不要混淆Window对象的location属性和Document对象的location对象。前者引用一个Location对象,后者只是一个只读字符串,并不具有Location对象的任何特性。Document.location与document.URL是同义的。但是,当存在服务器重定向时,document.location包含的是已经装载的URL,而location.href包含的则是原始请求的文档的URL。

什么是查询字符串?就是Location对象的search属性的值,在这里指?id=1&name=location

那么用Locaton对象结合String对象的方法怎么获取呢?可以用下面这个函数获取:

function getQuery(name)

  {

  var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");

  var r = window.location.search.substr(1).match(reg);

  if (r!=null) return unescape(r[2]); return null;

  }

参考网址:http://www.myexception.cn/javascript/1617241.html

如何获取浏览器URL中查询字符串的参数?的更多相关文章

  1. 如何获取浏览器URL中查询字符串的参数

    首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...

  2. JS获取浏览器URL中查询字符串的参数

    首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...

  3. 如何用js获取浏览器URL中查询字符串的参数

    首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...

  4. 请用js写一个函数,实现获取浏览器url中查询字符串中的参数并返回一个数组

    <script> console.log(getUrlArr()); function getUrlArr() { var arr = []; var url = "http:/ ...

  5. 你如何获取浏览器URL中查询字符串中的参数?

    测试地址为:http://www.runoob.com/jquery/misc-trim.html?channelid=12333&name=xiaoming&age=23 实例如下: ...

  6. 获取浏览器URL中查询字符串中的参数

    //http://www.runoob.com/index.html?name=xiaoming&age=23function showWindowHref(){ var sHref = wi ...

  7. 获取url中查询字符串参数

    // 获取url中查询字符串参数 例如http://www.test.com?a=1&b=2 function RequestParamete() { var url = window.loc ...

  8. 三个获取浏览器URL中参数值的方法

    这三个是一般的获取浏览器传的参数值的方法,之前有用unescape()解码的方法,但是遇到汉字会产生乱码,所以用decodeURI(); 方法一: function getQueryString(na ...

  9. mvc中查询字符串请求过长

    最近在mvc中做导出Excel功能,通过页面把字段id和对应的中文名称通过a标签传给控制器的过程中,总是报错. 1.第一次错误截图 具体解决方案: 可以配置 IIS 服务器以拒绝查询字符串长度大于指定 ...

随机推荐

  1. sql 和xml

    一·常用基本功能 表结果: 1. 1 <row> 2 <ID>1035</ID> 3 <Rate>6.12</Rate> 4 <Dat ...

  2. [CodeForces-763C]Timofey and remoduling

    题目大意: 告诉你一个长度为n的等差数列在模m意义下的乱序值(互不相等),问是否真的存在满足条件的等差数列,并尝试构造任意一个这样的数列. 思路: 首先我们可以有一个结论: 两个等差数列相等,当且仅当 ...

  3. VK Cup 2016 - Qualification Round 1 (Russian-Speaking Only, for VK Cup teams) A. Voting for Photos 水题

    A. Voting for Photos 题目连接: http://www.codeforces.com/contest/637/problem/A Description After celebra ...

  4. Google Code Jam 2010 Round 1C Problem A. Rope Intranet

    Google Code Jam 2010 Round 1C Problem A. Rope Intranet https://code.google.com/codejam/contest/61910 ...

  5. jQuery对象和Javascript对象

    jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象.jQuery 对象是 jQuery 独有的,其可以使用 jQuery 里的方法,但是不能使用 DOM 的方法:例如: $(&quo ...

  6. Android EditText 限制输入为ip类型

    editText.setInputType(InputType.TYPE_CLASS_NUMBER); String digits = "0123456789."; editTex ...

  7. Media Queries之Respond.js

    一.stackoverflow上面对css3-mediaqueries.js与respond.js的比较 css3-mediaqueries.js Pros Supports min, max and ...

  8. Android中数据存储(三)——SQLite数据库存储数据

    当一个应用程序在Android中安装后,我们在使用应用的过程中会产生很多的数据,应用都有自己的数据,那么我们应该如何存储数据呢? 数据存储方式 Android 的数据存储有5种方式: 1. Share ...

  9. web前端笔记整理,从入门到上天,周周更新

    由于大前端知识点太多,所以一一做了分类整理,详情可见本人博客 http://www.cnblogs.com/luxiaoyao/ 一.HTML 1.注释 格式:<!-- 注释内容 --> ...

  10. Ext NumberField使用

    Ext.onReady(function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget="side"; v ...