`
jandroid
  • 浏览: 1931074 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

js中自定义QueryString方法,获取url中的参数值

 
阅读更多

在js中,怎么获取url中传递的参数,请看下面的代码:

function QueryString(key) {

var reg= new RegExp (key + "=([^&#]*)","i");

var value = reg.exec(location.href);

if ( value == null )return null;

return decodeURI(value[1]);

}

测试结果如下:

//http://www.bbb.com/index.html?id=123&name=something
alert(QueryString('id'));
alert(QueryString('name'));
//Output
//123, something


//http://www.bbb.com/index.html#id=123#name=something
alert(QueryString('id'));
alert(QueryString('name'));
//Output
//123, something

QueryString主要是用到正则表达式来匹配相应的参数值。RegExp的详细用法,请参阅下文:

来源于:http://www.w3school.com.cn/js/jsref_obj_regexp.asp

JavaScript RegExp 对象参考手册

RegExp 对象

RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具。

直接量语法

/pattern/attributes

创建 RegExp 对象的语法:

new RegExp(pattern, attributes);

参数

参数pattern是一个字符串,指定了正则表达式的模式或其他正则表达式。

参数attributes是一个可选的字符串,包含属性 "g"、"i" 和 "m",分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前,不支持 m 属性。如果pattern是正则表达式,而不是字符串,则必须省略该参数。

返回值

一个新的 RegExp 对象,具有指定的模式和标志。如果参数pattern是正则表达式而不是字符串,那么 RegExp() 构造函数将用与指定的 RegExp 相同的模式和标志创建一个新的 RegExp 对象。

如果不用 new 运算符,而将 RegExp() 作为函数调用,那么它的行为与用 new 运算符调用时一样,只是当pattern是正则表达式时,它只返回pattern,而不再创建一个新的 RegExp 对象。

抛出

SyntaxError - 如果pattern不是合法的正则表达式,或attributes含有 "g"、"i" 和 "m" 之外的字符,抛出该异常。

TypeError - 如果pattern是 RegExp 对象,但没有省略attributes参数,抛出该异常。

修饰符

修饰符 描述
i 执行对大小写不敏感的匹配。
g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
m 执行多行匹配。

方括号

方括号用于查找某个范围内的字符:

表达式 描述
[abc] 查找方括号之间的任何字符。
[^abc] 查找任何不在方括号之间的字符。
[0-9] 查找任何从 0 至 9 的数字。
[a-z] 查找任何从小写 a 到小写 z 的字符。
[A-Z] 查找任何从大写 A 到大写 Z 的字符。
[A-z] 查找任何从大写 A 到小写 z 的字符。
[adgk] 查找给定集合内的任何字符。
[^adgk] 查找给定集合外的任何字符。
(red|blue|green) 查找任何指定的选项。

元字符

元字符(Metacharacter)是拥有特殊含义的字符:

元字符 描述
. 查找单个字符,除了换行和行结束符。
\w 查找单词字符。
\W 查找非单词字符。
\d 查找数字。
\D 查找非数字字符。
\s 查找空白字符。
\S 查找非空白字符。
\b 查找位于单词的开头或结尾的匹配。
\B 查找不处在单词的开头或结尾的匹配。
\0 查找 NUL 字符。
\n 查找换行符。
\f 查找换页符。
\r 查找回车符。
\t 查找制表符。
\v 查找垂直制表符。
\xxx 查找以八进制数 xxx 规定的字符。
\xdd 查找以十六进制数 dd 规定的字符。
\uxxxx 查找以十六进制数 xxxx 规定的 Unicode 字符。

量词

量词 描述
n+ 匹配任何包含至少一个 n 的字符串。
n* 匹配任何包含零个或多个 n 的字符串。
n? 匹配任何包含零个或一个 n 的字符串。
n{X} 匹配包含 X 个 n 的序列的字符串。
n{X,Y} 匹配包含 X 或 Y 个 n 的序列的字符串。
n{X,} 匹配包含至少 X 个 n 的序列的字符串。
n$ 匹配任何结尾为 n 的字符串。
^n 匹配任何开头为 n 的字符串。
?=n 匹配任何其后紧接指定字符串 n 的字符串。
?!n 匹配任何其后没有紧接指定字符串 n 的字符串。

RegExp 对象属性

FF: Firefox, IE: Internet Explorer

属性 描述 FF IE
global RegExp 对象是否具有标志 g。 1 4
ignoreCase RegExp 对象是否具有标志 i。 1 4
lastIndex 一个整数,标示开始下一次匹配的字符位置。 1 4
multiline RegExp 对象是否具有标志 m。 1 4
source 正则表达式的源文本。 1 4

RegExp 对象方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE
compile 编译正则表达式。 1 4
exec 检索字符串中指定的值。返回找到的值,并确定其位置。 1 4
test 检索字符串中指定的值。返回 true 或 false。 1 4

支持正则表达式的 String 对象的方法

FF: Firefox, IE: Internet Explorer

方法 描述 FF IE
search 检索与正则表达式相匹配的值。 1 4
match 找到一个或多个正则表达式的匹配。 1 4
replace 替换与正则表达式匹配的子串。 1 4
split 把字符串分割为字符串数组。 1 4

分享到:
评论

相关推荐

    JavaScript获取URL中参数querystring的方法详解

    JavaScript是Web开发中不可或缺的一部分,尤其在处理前端交互时,经常需要获取并解析URL中的查询字符串(query string)来获取特定的参数。本文将详细介绍两种在JavaScript中获取URL参数的方法,并探讨`Location`对象...

    JS根据key值获取URL中的参数值及把URL的参数转换成json对象

    要根据key值获取URL中的参数值,可以通过定义函数来实现。这通常涉及到正则表达式的使用,因为URL参数的格式为`key=value`,且多个参数之间用`&`符号分隔。可以通过以下步骤获取特定key对应的值: 1. 从`window....

    通过JS获取Request.QueryString()参数的值实现方法

    在JavaScript中,获取URL查询字符串(Query String)的参数值是一项常见的任务,这对于处理动态页面和Web应用程序至关重要。本文将详细介绍一种实现方法,通过自定义函数`getArgs()`来提取查询参数。 首先,我们来...

    js中获取URL参数的共用方法getRequest()方法实例详解

    在JavaScript(JS)中,获取URL参数是一项常见的任务,它涉及到解析URL字符串并提取其中的键值对。这里我们将深入探讨如何使用自定义函数`getRequest()`来实现这一功能,并比较另一种常用的获取URL参数的方法。 ...

    Node.js-轻量级url参数处理兼容浏览器和Node.js环境

    通过理解并利用JavaScript内置的`URLSearchParams`、Node.js的`querystring`模块、第三方库如`query-string`,或是自定义的解决方案,都可以实现轻量级且兼容的URL参数处理。同时,确保代码在不同环境下具有良好的...

    Js日历控件传递url参数

    接着,我们需要将这个日期参数附加到URL中。这可以通过修改当前页面的`window.location.href`属性实现,或者使用`window.open()`打开一个新的URL。 在ASP环境中,服务器端代码可以接收并解析这些URL参数。ASP是一种...

    JSP中java代码与js之间的传值

    - JavaScript通过XMLHttpRequest设置自定义HTTP头,Java端通过HttpServletRequest的getHeader()方法获取。 综上所述,Java和JavaScript之间的值传递涉及多种方法,具体选择哪种取决于应用场景、数据量、安全性需求...

    前端开源库-simple-url-search-params

    3. 获取参数:使用get方法获取单个参数值,getAll方法获取所有同名参数的数组。 ```javascript let value = params.get('key'); let values = params.getAll('key'); ``` 4. 删除参数:使用delete方法删除指定参数...

    node.js中的querystring.stringify方法使用说明

    在Node.js环境中,`querystring`模块提供了一系列用于处理URL查询字符串的工具,其中包括`querystring.stringify`方法。这个方法的主要功能是将一个JavaScript对象转换为URL查询字符串格式,便于在网络请求中使用。...

    node.js中的querystring.parse方法使用说明

    在Node.js环境中,`querystring`模块是一个非常实用的工具,它提供了处理URL查询字符串的各种方法,其中之一就是`querystring.parse`。这个方法主要用于将一个包含键值对的字符串解析成一个JavaScript对象,使得我们...

    在JavaScript中获取请求的URL参数[正则]

    在JavaScript中,获取URL参数是前端开发中常见的需求,特别是在处理动态交互的网页...这两种方法都可以有效地从URL中提取出所需的参数值。在实际项目中,你可以根据代码可读性、性能需求以及个人喜好来选择合适的方法。

    next-custom-query:使用自定义服务器并在URL中进行查询的示例Next.js应用

    这个应用特别关注于如何处理URL中的查询参数,并在服务器端进行相应的操作。 在Next.js中,通常使用内置的`getStaticProps`或`getServerSideProps`来获取动态数据。但是,如果默认的查询机制不能满足特定需求,...

    node.js中的querystring.escape方法使用说明

    这个方法主要用于对查询字符串中的特殊字符进行编码,确保它们能够在URL中正确传递和解析。`querystring.escape`是基于`encodeURIComponent`函数实现的,下面我们详细探讨其用法和原理。 ### 1. `querystring....

    node.js入门教程之querystring模块的使用方法

    如果需要使用自定义的编码函数,该函数应该能将URL中不安全的字符转换为百分比编码形式。 例如,querystring.stringify({name: 'whitemu', sex: ['man', 'women']})会返回字符串"name=whitemu&sex=man&sex=women"。...

    js代码-获取url参数

    在实际项目中,`main.js`可能包含了上述的某一种或多种方法来实现URL参数的获取。`README.txt`可能是解释如何使用这个代码或者其工作原理的文档。 理解如何在JavaScript中获取URL参数对于前端开发者来说非常重要,...

    22-querystring (查询字符串).pdf

    综上所述,`querystring`模块是Node.js中处理查询字符串的强大工具,无论是在构建URL、解析请求参数还是序列化数据,都能提供高效、灵活的支持。了解并熟练掌握这些方法,对于开发Web应用尤其是后端服务至关重要。在...

    Node.JS获取GET,POST数据之queryString模块使用方法详解

    在Node.js环境中,处理HTTP请求时,GET和POST请求中的数据通常包含在URL查询字符串或请求体中。Node.js的内置`querystring`模块提供了一系列工具来方便地处理这些查询字符串,使得开发者能够轻松地解析和序列化这些...

    js通过location.search来获取页面传来的参数

    总的来说,通过`location.search`和自定义的`GetQueryString`函数,开发者可以方便地在JavaScript中获取和处理URL中的查询参数,这对于实现动态交互、数据传递等功能非常有用。在实际开发中,还可以对这个函数进行...

    URL的参数中有加号传值变为空格的问题(URL特殊字符)

    当我们在URL中传递参数时,如果参数值包含了像“+”这样的特殊字符,浏览器会默认将其视为空格。这是因为根据URL编码标准,加号 (+) 在URL中通常代表空格。例如,如果你有这样一个参数:`key=value+OK`,在传递到...

    URLtochart使用chartjs和chartjsnode将一个URL转成图表

    在URLtochart项目中,Chart.js负责解析URL中的数据并将其渲染成可视化图表。 **chartjs-node** 是Chart.js的一个扩展,允许在Node.js环境中创建和渲染图表。由于Node.js主要用于服务器端编程,chartjs-node使得...

Global site tag (gtag.js) - Google Analytics