JS获取浏览器URL中查询字符串的参数
首先要知道Location这个对象以及这个对象中的一些属性:
href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/
host:设置或返回主机名和当前的URL的端口号。本博客首页返回www.cnblogs.com
hostname:设置或返回当前URL的主机名。本博客首页返回www.cnblogs.com
hash:设置或返回从井号(#)开始的URL(锚)。本博客首页返回 空
pathname:设置或返回当前URL的路径部分。本博客首页返回/wymninja/
port:设置或返回当前URL的端口号。本博客首页返回 空
protocol:设置或返回当前URL的协议。本博客首页返回 http:
search:设置或返回从问号 (?) 开始的 URL(查询部分)
location对象属性图示:图片来自慕课网

location的href属性存放的是文档的完整 URL,其他属性则分别描述了 URL 的各个部分。这些属性与 Anchor 对象(或 Area 对象)的 URL 属性非常相似。当一个 Location 对象被转换成字符串,href 属性的值被返回。这意味着你可以使用表达式 location 来替代 location.href。不过 Anchor 对象表示的是文档中的超链接,Location 对象表示的却是浏览器当前显示的文档的 URL(或位置)
var s = location.toString();
console.log(s);
#result
//http://www.cnblogs.com/wymninja/
Location对象的这些属性都是可读可写的,如果改变了文档的location.href,则浏览器会载入新的页面。同样如果改变了location.hash,则页面会跳转到新的锚点,但此时页面不会重载。
Location对象还有三个方法:assign()、reload()、replace()
assign():加载新的文档
reload():可以重新装载当前文档
replace():可以装载一个新文档而无须为它创建一个新的历史记录。也就是说,在浏览器的历史列表中,新文档将替换当前文档。这样就不能通过【返回】按钮返回当前文档了。
注意:
不要混淆Window对象的location属性和Document对象的location对象。前者引用一个Location对象,后者只是一个 只读字符串,并不具有Location对象的任何特性。Document.location与document.URL是同义的。但是,当存在服务器重定 向时,document.location包含的是已经装载的URL,而location.href包含的则是原始请求的文档的URL。
所以要获取浏览器URL中查询字符串的参数。也就是location.search部分。以慕课网图片为例就是?courseid = 8&cahpterid = 86中的8和86!!!!然后就利用如下代码:
function getQuery(name){
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);//从?之后开始匹配如getQuery(courseid)返回一个数组["courseid=8","","8","&",index:0,input:"courseid=8"]
if (r!=null) return unescape(r[2]); return null;
}
其中:
对match不清楚可查阅我的博客Javascript string对象
unescape 对参数进行解码,如空格解码为20%。
JS获取浏览器URL中查询字符串的参数的更多相关文章
- 如何用js获取浏览器URL中查询字符串的参数
首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...
- 如何获取浏览器URL中查询字符串的参数
首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...
- 如何获取浏览器URL中查询字符串的参数?
如何获取浏览器URL中查询字符串的参数? 想要知道怎样解决这个问题,首先我们先认识一下Location对象. Location对象包含了当前页面与位置(url)相关的信息 URL示例:http://w ...
- 请用js写一个函数,实现获取浏览器url中查询字符串中的参数并返回一个数组
<script> console.log(getUrlArr()); function getUrlArr() { var arr = []; var url = "http:/ ...
- 你如何获取浏览器URL中查询字符串中的参数?
测试地址为:http://www.runoob.com/jquery/misc-trim.html?channelid=12333&name=xiaoming&age=23 实例如下: ...
- 获取浏览器URL中查询字符串中的参数
//http://www.runoob.com/index.html?name=xiaoming&age=23function showWindowHref(){ var sHref = wi ...
- 获取url中查询字符串参数
// 获取url中查询字符串参数 例如http://www.test.com?a=1&b=2 function RequestParamete() { var url = window.loc ...
- 三个获取浏览器URL中参数值的方法
这三个是一般的获取浏览器传的参数值的方法,之前有用unescape()解码的方法,但是遇到汉字会产生乱码,所以用decodeURI(); 方法一: function getQueryString(na ...
- js获取页面url中的各项值
一. 通过window.location获取各项参数 1.获取页面完整的url url = window.location.href; 2.获取页面的域名 host = window.location ...
随机推荐
- 关于Rigidbody,Collider和CharacterController三者之间的关系和用法的总结
Rigidbody:多用在“物体”上,因为“物体”都是“死”的,他们的运动一般都是靠物理系统.所以对于Rigidbody的移动,不要用Translate(),要用各种“力”, 比如:Rigidbody ...
- Visual Studio 2015部署OpenCV
Visual Studio 2015的安装破解及OpenCV的安装和部署 平台:win10 X64+VS2015专业版 X64:vs2015.pro_chs+OpenCV 3.X:opencv-3.4 ...
- shell脚本清空redis库缓存
前提: 现在做的一个业务系统,用了redis做缓存. 系统做了缓存,通常在系统正常使用的过程中,可以节省很多系统资源,特别是数据库资源. 但是,在开发.测试或者系统遇到问题的时候,也有很麻烦的事情. ...
- 2018.10.31 NOIP模拟 几串字符(数位dp+组合数学)
传送门 如果观察到性质其实也不是很难想. 然而考试的时候慌得一批只有心思写暴力233. 下面是几个很有用的性质: c0,1+1≥c1,0≥c0,1c_{0,1 }+1 ≥ c_{1,0} ≥ c_{0 ...
- [转载]使用PHP_CodeSniffer规范php代码
为什么使用PHP_CodeSniffer 一个开发团队统一的编码风格,有助于他人对代码的理解和维护,对于大项目来说尤其重要. PHP_CodeSniffer是PEAR中的一个用PHP5写的用来检查嗅探 ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
- java项目显示红叉,程序却没有错误
转 http://blog.sina.com.cn/s/blog_825b7d7c0102w7rq.html (2016-07-02 11:38:38) 分类: javaWeb 电脑换了不同版本的 ...
- Ubuntu Server 命令行下的默认语言改为英语en_US.UTF-8
源文链接:http://tonychiu.blog.51cto.com/656605/393131 如果Ubuntu Server在安装过程中,选择的是中文(很多新手都会在安装时选择中文,便于上手), ...
- (转)ASP.NET MVC 4 RC的JS/CSS打包压缩功能
转自:http://www.cnblogs.com/shanyou/archive/2012/06/22/2558580.html 打包(Bundling)及压缩(Minification)指的是将多 ...
- hdu2222(ac自动机模板)
#include<iostream> #include<cmath> #include<cstdio> #include<cstring> #inclu ...