总结获取url中查询参数的两种方式
url中的所有查询参数可以通过 window.location.search 字段获取,以字符串的形式返回。并有固定的格式 ?param1=value1¶m2=value2···,所以可以正则表达式匹配。
分析下需要匹配的格式:
前后查找和边界的介绍可以细看MDN中的详细介绍。
搞定正则之后,使用string的match方法,就能直接获取到对应的参数值
function getUrlParamsByName(name) {
// \b 边界
// ?<= 向后匹配
// 字符串转成正则表达式,其中的'\b'类型的特殊字符要多加一个'\'
let reg = new RegExp(`(?<=\\b${name}=)[^&]*`),
str = location.search || '',
target = str.match(reg);
if(target) {
return target[0]
}
return;
}
上一个方法是获取单个的参数值,此方法是为了解析出所有的参数
function getUrlParams() {
let obj = {};
if (!window) {
return;
}
let str = window.location.search || '';
if (str && str.slice(1)) {
// 去掉 ? ,然后以 & 分割
let queryArray = str.slice(1).split('&');
queryArray.map((query) => {
// param=value 以 = 分割
let temp = query.split('=');
if(temp.length > 1) {
// 收集参数
obj[temp[0]] = temp[1];
}
})
}
return obj;
}
正则表达式的方式更加灵活便捷啊,开始用的时候不习惯,后来觉得真香!
在前端开发中,经常会遇到获取URL的相关数据,下面将总结下使用JavaScript来获取url地址的协议,参数,端口号,锚点等方法。
ECMAscript中所有函数的参数都是按值传递,也就是,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样。js始终是按值传递,在这里称他为共享传递。
URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。URLSearchParams()是个构造函数,将返回一个可以操作查询字符串的对象。
通过访问arguments对象的length属性可以获取有多少个参数传递给了函数。在封装函数的时候,会携带不同的参数,我们想要获取指定的参数,可以通过 arguments[ ] 来拿到,arguments对象可以与命名参数一起使用。arguments的值要永远与对应命名参数的值保持同步
给外部引用的js文件传递参数的4种方式:定义全局变量、在src后面传参、检索js文件(js文件要最后引入)、设置其他属性
一般error函数返回的参数有三个: function(jqXHR jqXHR, String textStatus, String errorThrown)。常见调用代码如下:这里对这三个参数做详细说明。
在日常工作中,我们需要将匹配到的所有路由,映射到一个组件上。如下代码想要达到的效果:不传page和id,则映射到user默认list页面,传page和id,根据page不同,显示不同的页面
函数是一段结合在一起执行特定任务的代码,函数一般使用参数与外部进行交互。要编写简洁高效的JS代码,必须掌握函数参数。在本文中,会使用一些有趣的例子来解释 JS 必须有效地处理函数参数的所有特性。
前后端传参一般有两种形式:key=value 形式传参(即 parameter 形式);body 形式传参(传 json 数据给后端),如果使用的是 GET 请求,浏览器展示的 Request URL 会自动在路径后面加上 ?a=1&b=2这样的参数,这就是 key=value 形式传参
* 参数可以使用逗号或分号分隔。 (建议使用分号,因为逗号具有双重含义:可以将其解释为mixin参数分隔符或者是css列表分隔符);使用逗号作为mixin分隔符使不可能创建逗号分隔的列表作为参数。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!