您好,欢迎来到二三娱乐。
搜索
您的当前位置:首页前端必知必会--操作URL的黑科技

前端必知必会--操作URL的黑科技

来源:二三娱乐

杀鸡焉用牛刀呢,今天我们来学习下专门用来处理URL的query的接口:URLSearchParams 。

简单使用

只需要new一个URLSearchParams的实例即可,代码:

leturl ='?wd=蔡徐坤&skill=篮球&year=2019';letsearchParams = new URLSearchParams(url);for(letpofsearchParams) {  console.log(p);}// ["wd","蔡徐坤"]// ["skill","篮球"]// ["year","2019"]复制代码

获取单个字段

假如现在我只想获取单个字段的值,该怎么办呢?只需要调用这个实例的get方法即可, 代码:

searchParams.get('wd')// "蔡徐坤"searchParams.get('skill')// "篮球"searchParams.get('year')// "2019"复制代码

有时候不知道一个字段是否存在,所以想事先校验下。使用实例的has方法进行判断,代码:

searchParams.has('wd')// truesearchParams.has('age')// false复制代码

添加字段

实例提供了append方法来添加字段,这个方法接收两个参数,前者是key,后者是value,代码:

searchParams.append('age',26);searchParams.has('age');// truesearchParams.get('age');// 26复制代码

删除字段

现在不想要year字段了,直接使用delete即可,代码:

searchParams.delete('year');searchParams.has('year');// false复制代码

设置字段

有时候想重写一个字段,而不是添加(append)一个字段,这时候需要使用set方法,比如,我们觉得坤哥不仅会篮球,还会唱,跳,rap。代码:

searchParams.set('skill','篮球 唱 跳 rap');复制代码

转为字符串

修改实例后,有时候需要再转为字符串,进行路由跳转等,使用toString方法

searchParams.toString();// "wd=蔡徐坤&skill=篮球+唱+跳+rap&year=2019&age=26"复制代码

Copyright © 2019- yule263.com 版权所有 湘ICP备2023023988号-1

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务