今天碰到获取地址参数的问题,所以总结了一下。

第一种情况:获取地址栏参数

function getUrlParam(name){
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r!=null) return unescape(r[2]); return null; //返回参数值
}

调用的时候直接getUrlParam("参数名")就可以。挺好用,网上基本都是这个方法。

不过这个方法只能获取地址栏的参数,因为window.location.search是一个私有方法:

输入:http://www.js-51.com/news/2012-5/GUANLIRUANJIANYAOBUYAOBAYIYONGXINGFANGZAIZHONGYAOWEIZHI.html?q=all&l=zh-cn#go

1 href
全部URl字符串(在浏览器中就是完整的地址栏)
返回: http://www.js-51.com/news/2012-5/GUANLIRUANJIANYAOBUYAOBAYIYONGXINGFANGZAIZHONGYAOWEIZHI.html?q=all&l=zh-cn#go 2 protocol
URL 的协议部分
返回:http: 3 host
URL 的主机部分
返回:www.js-51.com 4 port
URL 的端口部分
假如采用默认的80端口(即使添加了:80),那么返回值并不是默认的80而是空字符
返回:"" 5 pathname
URL 的路径部分(就是文件地址)
返回:/news/2012-5/GUANLIRUANJIANYAOBUYAOBAYIYONGXINGFANGZAIZHONGYAOWEIZHI.html?q=all&l=zh-cn#go 6 search
查询(参数)部分
返回:?q=all&l=zh-cn 7 hash
锚点
返回:#go 

(详细可以查看JS解析url,写的还是比较详细的)

第二种情况:获取地址参数

我碰到这个情况是 获取一个列表元素中的地址,并在模态框中iframe打开这个地址。这时window.location.search就不能用了,所以我略作了修改

function getParam(place,name){
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); //构造一个含有目标参数的正则表达式对象
var r = place.substr(place.indexOf("?")+1).match(reg); //匹配目标参数
if (r!=null) return unescape(r[2]); return null; //返回参数值
}

这样就可以获取任意位置的类似地址栏的参数,使用的时候就getParam("place","name")。

place就是想要获取的地址,eg:

var val = $(this).find("a").attr("value");
var id = getParam(val,"id");
console.log(id) 如果想要获取地址栏的参数,place参数可以写window.location.href或者window.location.search就是上面列出的几个。

以上就是这次的总结,欢迎大家交流、使用,有更好的方法欢迎讨论~

JS获取地址参数的更多相关文章

  1. 【转】javascript浏览器参数的操作,js获取浏览器参数

    原文地址:http://www.haorooms.com/post/js_url_canshu html5修改浏览器地址:http://www.cnblogs.com/JiangXiaoTian/ar ...

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

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

  3. (转)用JS获取地址栏参数的方法(超级简单)

    转自http://www.cnblogs.com/fishtreeyu/archive/2011/02/27/1966178.html 用JS获取地址栏参数的方法(超级简单) 方法一:采用正则表达式获 ...

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

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

  5. js获取url参数的方法

    js获取url参数的方法有很多. 1.正则分析 function getQueryString(name) { var reg = new RegExp("(^|&)" + ...

  6. get方法与post方法的区别与js获取url参数的方式

    1.get方法与post方法的区别: 区别一:get重点在从服务器上获取资源,post重点在向服务器发送数据:区别二:get传输数据是通过URL请求,以field(字段)= value的形式,置于UR ...

  7. 原生JS获取地址了参数

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

  8. 用JS获取地址栏参数的方法

    采用正则表达式获取地址栏参数: function GetQueryString(name) {      var reg = new RegExp("(^|&)"+ nam ...

  9. 用JS获取地址栏参数的方法(超级简单)

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

随机推荐

  1. MVC5移除不常用Nuget命令

    ---移除JQuery.* 和bootstartp Uninstall-Package bootstrap Uninstall-Package Microsoft.jQuery.Unobtrusive ...

  2. cocos2dx 音效 粒子 数据存储

    1.音效 引入头文件 #include "simpleAudioEngine.h" 命名空间 using namespace CocosDenshion; //创建一个背景 Siz ...

  3. 解决Hibernate中不同包内有形同实体导致映射失败的问题

    报错代码如下: Caused by: org.hibernate.DuplicateMappingException: duplicate import: Engin refers to both t ...

  4. 电脑文本text和部分文字出现其他语言乱码

     1.文本的编码存在问题 解决办法: 将text文件打开>>文件(左上角)>>另存为>>选择其他格式的编码试试(在保存键左侧)>>保存再打开 2.系统区 ...

  5. 512M内存机器如何用好Mysql

    购买阿里云512M内存ECS后,mysql有时候会自动关闭,停止运行 解决办法: a,优化mysql配置,因为自己安装的是mysql 5.6,而从5.6开始,mysql安装包中不再包含my-small ...

  6. AngularJS 通过 Spring Restful 上传文件

    总结一下,在写下这些文字之前心里很不爽,一个小问题倒腾了这么久...  JS 端: // 指令 app.directive('fileModel', ['$parse', function($pars ...

  7. javascript-几个基础的排序算法

    对这几个基础排序算法进行梳理,便于以后查看. /** * * 冒泡排序 * 从末尾开始相邻两数相互比较大小,满足条件就交换位置.循环每进行一次,即可确定第i位数的值. *冒泡排序的时间复杂度为O(n^ ...

  8. 简单的thinkPHP3.2运行实例。

    在上一篇的环境基础下. 我们用zendstudio12.5版本编写我们的代码.具体的下载方式在这里就不多做注明了.自己百度就可以搞定. 首先我们用zendstudio12.5 导入我们从网上随处都可以 ...

  9. Python核心编程(第七章)--映像和集合类型

    字典:它是一个容器类型,能存储任意个数的Python对象,也包括其他容器类型,Python的字典是作为可变的哈希表实现的 映像类型中的数据是无序排列的   可以用工厂方法dict()来创建字典,也可以 ...

  10. 自定义ListView分割线

    要完成自定义分割线,我们先来认识一下listview中的两个属性: android:divider 设置list 列表项的分隔条(可用颜色分隔,也可用Drawable分隔) android:divid ...