es6从url中获取想要的参数

已于 2023-12-08 17:47:24 修改
阅读量689 收藏 2
点赞数 1
文章标签： es6 前端 javascript
于 2023-12-07 11:59:56 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hero_rong/article/details/134851955
版权
第一种方法

很古老，通过 split 方法慢慢截取，可行是可行但是这个方法有一个弊端，因为 split 是分割成数组了，只能按照下标的位置获取值，所以就是参数位置一旦发生变化，那么获取到的值也就错位了

let userName = window.location.search.split('&')[1] ? window.location.search.split('&')[1].split('=')[1] : '';
第二种方法

比较优雅，我们通过 URLSearchParams 对象来解析URL中的参数，所以就算 url 中的参数位置发生变化也没有关系

const params = new URLSearchParams(window.location.search);
const accessToken = params.get('accessToken');

上述代码假设URL的查询字符串以?分隔，并且每个参数以&分隔。如果你的URL格式不同，你可能需要根据实际情况进行适当的调整。

请注意，如果URL中带有+不建议使用第二种方法，因为第二种方法会过滤掉+，别问我怎么知道的 /(ㄒoㄒ)/~~

Hero_rong
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ES6中参数的默认值语法介绍
08-30
ES6允许为函数参数设置默认值，即直接写在参数定义后面。下面篇文章主要介绍了ES6中参数默认值语法的相关资料，对大家具有一定的参考价值，需要的朋友下面来一起看看吧。
获取url的参数：getUrlParam
神zhi殇的博客
09-12 6638
declare function unescape(string: string): string; // 引用 // 使用 getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象 // console.log(reg);...
ES之API系列--通过Url查询的方法(有实例)
IT利刃出鞘的博客
10-09 3289
原文网址： 简介 说明 本文介绍ElasticSearch如何通过Rest API（URL）来查询数据。 Elasticsearch有两种查询方式 URI带有查询条件(轻量查询) 查询能力有限，只适合比较简单的查询。 请求体中带有查询条件(复杂查询) 查询条件以JSON格式表现，作为查询请求的请求体，适合复杂的查询 。 官网 Search API | Elasticsearch Reference [7.15] | Elastic url查询 请求参数位于_...
Elasticsearch-URL查询实例解析
06-24 1029
ES（elasticsearch）,以下简称ES ES的查询有query、URL两种方式，而URL是比较简洁的一种，本文主要以实例探讨和总结URL的查询方式 1、语法 curl [ -s][ -g][ -X<REST Verb>][ -H 'Content-Type: application/json'] '<Node>:<Port>/&lt...
Elasticsearch Search API - URL Search
Seina
05-23 1318
一、了解 Search API 实现对 es 中存储的数据进行查询，endpoint 为 _search，如下所示： //查询全部 GET /_search //指定单个索引查询 GET /my_index/_search //指定多个索引查询 GET /my_index1,my_index2/_search //通配符查询 GET /my_*/_search 查询主要由两种形式 ...
es6 获取url参数
wangatong的博客
04-18 1515
function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); console.log(window.location.search)//?id=2 var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); re
【全网最精简写法】ES6获取浏览器url跟参
我驾驶汽车从不是为了从A点到达B点，我喜欢去感受汽车，与之交流，与之融为一体。
07-09 5332
//ES6获取浏览器url跟参 public getUrlParam = a => (a = location.search.substr(1).match(new RegExp(`(^|&)${a}=([^&]*)(&|$)`)),a?a[2]:null);
获取地址栏参数
MoLvSHan的博客
04-08 953
采用es6写法，单独写在js文件里，通过import引用 export function getUrlParams() { let str = location.href; let num = str.indexOf('?'); const param = {}; str = str.substr(num + 1); const arr = str.split('&amp;...
小技巧： 用ES6的方式获取URL链接中的参数
yangxinxiang84的专栏
07-24 2610
直接撸代码： function getURLParams() { const searchURL = location.search; // 获取到URL中的参数串 const params = new URLSearchParams(searchURL); const valueObj = Object.fromEntries(params); // 转换为普通对象 return valueObj; } ...
用JS获取地址栏参数的方法（超级简单）
02-27 4189
方法一：采用正则表达式获取地址栏参数：（强烈推荐，既实用又方便！） function GetQueryString(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match...
html页面动态获取连接参数 jquery.params.js
09-06
类似 bb.html?data=1&data2=2这种页面跳转，通过该js可以获取参数 方法：在目标页面，即bb.html中使用一下代码即可： var data=$.query.get("data")
ES6中的rest参数与扩展运算符详解
08-29
rest参数和扩展运算符都是ES6新增的特性。下面这篇文章主要给大家介绍了关于ES6中rest参数与扩展运算符的相关资料，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。
es6函数之rest参数用法实例分析
11-20
es6引入rest参数(形式为 …变量名)，用于获取函数的多余参数，这样就不需要使用arguments对象了，rest参数搭配的变量是一个数组，该变量将多余的参数放入数组中。 function add (...values) { let sum = 0; for ...
ES6知识点整理之函数数组参数的默认值及其解构应用示例
10-17
主要介绍了ES6知识点整理之函数数组参数的默认值及其解构应用,结合实例形式分析了ES6函数数组参数解构赋值和默认值的设置相关操作技巧,需要的朋友可以参考下
Es6和Es5的区别？
FENGZXCjjjjj的博客
04-28 357
2、块级作用域：在ES5中，只存在全局作用域和函数作用域，而ES6中增加了块级作用域，对于if、for、switch等代码块内部所声明的变量，在外部是不可见的。3、箭头函数：ES6中新增了箭头函数，可以更为简洁地定义函数，同时箭头函数没有自己的this，它的this绑定在父级作用域的this上。1、变量声明方式不同：ES5使用var关键字进行变量声明，而ES6则引入了let和const关键字来声明变量。6、模块化：ES6中引入了模块化的概念，通过export和import关键字来实现模块的导出和引入。
element-ui的bug记录
nick_zhang的博客
04-29 561
7.el-dialog组件在关闭时，会触发子组件的created/mounted生命周期。原因是当visible改变为false，即关闭dialog的时候，如果用户设置了destroyOnClose=true，则执行key++；key是绑定在较外层的div上的，key值的变化会导致这个div重新渲染。6.select 的 popper-append-to-body ,默认值为true;dialog的append-to-body,默认值为false;3.element表格前端分页。
【Web】CTFSHOW 中期测评刷题记录(1)
最新发布
uuzeray的博客
05-02 1490
访问./cache/6a992d5529f459a44fee58c733255e86.php，命令执行拿flag。login.php是在./templates下的，而./flag.php与./templates均为web目录。注意到用./template/error.php中存在{{username}}，可以用其cache来写马。这时候重开下靶机再去读./templates/index.php，发现是给了提示的。访问./config/settings.php，命令执行拿到flag。
判断前端入参是否空否则提示前端写法
qq_39306234的博客
04-28 327
前端先声明一个变量，用于alert判断。在templeat中定义一个提示语句。然后在点击事件时判断一下是否展示。
前端调用WebSocket协议接口获取数据
m0_56023096的博客
04-29 428
createWs("测试数据", (res) => {
获取浏览器URL中查询字符串中的参数并且只输出参数名和参数值
07-16
在原生JavaScript中，可以使用`URLSearchParams`对象来获取浏览器URL中的查询字符串参数，并且只输出参数名和参数值。 以下是获取浏览器URL中查询字符串参数的示例代码： ```javascript // 获取当前页面的URL var url = window.location.href; // 创建URLSearchParams对象，传入查询字符串 var searchParams = new URLSearchParams(url); // 遍历所有参数，输出参数名和参数值 searchParams.forEach(function(value, key) { console.log(key + ": " + value); }); ``` 在上述示例中，我们使用`window.location.href`获取当前页面的URL，并将其作为参数传递给`URLSearchParams`对象。然后，使用`forEach`方法遍历所有参数，并输出参数名和参数值。 注意：`URLSearchParams`是ES6中的新特性，不支持旧版本的浏览器。如果需要在不支持`URLSearchParams`的浏览器上运行，可以使用URL解析库，比如`query-string`或者自己编写解析函数来处理查询字符串。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值