获取Url地址中参数的3种方法【华为云技术分享】
获取Url的代码如下:window.location.href;
方法一:原生js(假设已经获得了Url地址)
var url = 'https://gitbook.cn/gitchat/geekbooks?tag=JavaScript&name=pwwu&age=24';
var temp1 = url.split('?');
var pram = temp1[];
var keyValue = pram.split('&');
var obj = {};
for (var i = ; i<keyValue.length; i++){
var item = keyValue[i].split('=');
var key = item[];
var value = item[];
obj[key] = value;
}
console.log(url);
console.log(temp1); // ['https://gitbook.cn/gitchat/geekbooks','tag=JavaScript&name=pwwu&age=24']
console.log(pram); // tag=JavaScript&name=pwwu&age=24
console.log(keyValue); // ['tag=JavaScript','name=pwwu','age=24']
console.log(obj); // {tag:'JavaScript',name:'pwwu',age:'24'}
总结:主要思路就是将Url用split()分割成不同的块,返回值为一个数组,一直分割到为 [‘tag=JavaScript’,‘name=pwwu’,‘age=24’]为止,
然后将该数组中的每一项以键值对的形式传进一个空对象obj(这里需要遍历数组),最后利用obj.name“点”的方式获取相应参数。
方法二 URLSearchParams()函数(记不住函数名的可以直接在浏览器里面打印)
var url2 = 'https://gitbook.cn/gitchat/geekbooks?tag=%E5%A4%A7%E6%95%B0%E6%8D%AE&name=gy&age=22';
var temp2 = url2.split('?')[];
var pram2 = new URLSearchParams('?'+temp2);
console.log(pram2.get('tag')); // 大数据
console.log(pram2.get('name'));// gy
console.log(pram2.get('age')); //
console.log(temp2); //tag=%E5%A4%A7%E6%95%B0%E6%8D%AE&name=gy&age=22
方法三 使用正则表达式
//获取url中的参数方法
function getUrlParam(name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr().match(reg);
//返回参数
if (r != null) {
return unescape(r[]);
} else {
return null;
}
}
var ABC = getUrlParam();
console.log(ABC);
本次暂时介绍以上3种,后续会不断补充。
HDC.Cloud 华为开发者大会2020 即将于2020年2月11日-12日在深圳举办,是一线开发者学习实践鲲鹏通用计算、昇腾AI计算、数据库、区块链、云原生、5G等ICT开放能力的最佳舞台。

获取Url地址中参数的3种方法【华为云技术分享】的更多相关文章
- 使用JS准确获取URL网址中参数的几种方法
记录下使用JS准确获取URL网址中参数的方法: 参考链接1. https://blog.csdn.net/Zhihua_W/article/details/54845945?utm_source=bl ...
- JS动态获取项目名以及获取URL地址中的参数
在项目当中我们可能会遇到例如改变的项目名称之后,相对应的地址就需要改变,为了减少工作量,将地址当中的项目名这一块写成动态获取的,那么最关键一点就是我要先获取它,再进行操作: 知识点整理,话不多说,直接 ...
- 用JS解决url地址中参数乱码的问题
var url = window.location.herf;//获取url地址 var obj = {}; //最后输出的对象 var reg = /\?/; //要匹配的正则表达式 if(url. ...
- 转:Web页面通过URL地址传递参数常见问题及检测方法
Web页面即我们在浏览器中所看到的网页,在Web应用程序中,其页面往往需要进行动态切换和数据交互,页面间的数据常规传递方法有多种,本文主要介绍Web页面处理程序中常见的URL地址参数传递方法,包括概述 ...
- Laravel 获取 Route Parameters (路由参数) 的 5 种方法
Laravel 获取路由参数的方式有很多,并且有个小坑,汇总如下. 假设我们设置了一个路由参数: 现在我们访问 http://test.dev/1/2 在 TestController ...
- js获取url地址的参数的方法
js获取url参数值 今天说一下如何获取url参数值. 思路 通过location的search就可以获取到url中问号后面的值. 字符串过滤到问号 通过split方法分割参数集合 循环赋值 匹配对应 ...
- js获取URL地址的参数
function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&] ...
- 大型情感剧集Selenium:6_selenium中的免密登陆与cookie操作【华为云技术分享】
网站登录 现在各大平台在反爬虫功能上,可谓花样繁多.总结下来按照破解成功率排名,最高的是滑动解锁.其次是验证码数字.之后是一次点击对应的汉字,最后是想12306之前那种反人类的让你说那些是奶糖吧,哈哈 ...
- Too many open files的四种解决办法【华为云技术分享】
[摘要] Too many open files有四种可能:一 单个进程打开文件句柄数过多,二 操作系统打开的文件句柄数过多,三 systemd对该进程进行了限制,四 inotify达到上限. 领导见 ...
随机推荐
- https申请证书并部署到网站流程,浏览器验证证书流程
https申请证书并部署到网站流程: 1.生成一对秘钥,设公钥为pubk1,私钥为prik12.假设发布的网站地址为https://www.example.com3.生成一个CSR文件(Cerific ...
- React + Ts 实现三子棋小游戏
在这里阅读效果更佳 还记得当年和同桌在草稿纸上下三子棋的时光吗 今天我们就用代码来重温一下年少(假设你有react基础,没有也行,只要你会三大框架的任意一种,上手react不难) 游戏规则 双方各执一 ...
- VMware基本用法
###VMware tools 介绍 只有在VMware虚拟机中安装好了VMware Tools,才能实现主机与虚拟机之间的文件共享,同时可支持自由拖拽的功能,鼠标也可在虚拟机与主机之前自由移动(不用 ...
- 其他综合-CentOS 7 搭建模板机
CentOS 7 搭建模板机 [基于此文章的环境]点我快速打开文章 1.修改静态地址 ip a|awk -F '[ /]+' '$NF~/eth0/ {print $3}' cat >/etc/ ...
- 剖析linux内核中的宏-----------offsetof
offsetof用于计算TYPE结构体中MEMBER成员的偏移位置. #ifndef offsetof#define offsetof(TYPE, MEMBER) ((size_t) &((T ...
- 201871010105-曹玉中《面向对象程序设计(java)》第十周学习总结
201871010105-曹玉中<面向对象程序设计(java)>第十周学习总结 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这 ...
- Ant下载与安装
1.登录http://ant.apache.org/bindownload.cgi 站点下载Ant最新版建议Windows平台下载*.zip压缩包 2.将下载到的压缩文件压缩到(G:software\ ...
- 不使用已下载的package pip 安装 & 出现time out error
pip install XX + --no-cache-dir 安装出现time out error时: pip --default-timeout=10000 install XX
- vscode使用插件来添加文件说明和函数说明——42header——psioniq File Header——koroFileHeader
安装号以后,设置快捷键如下: 同时需要根据自己的需要的修改json文件 // 文件头部注释 "fileheader.customMade": { "Description ...
- LG2272/BZOJ1093 「ZJOI2007」最大半连通子图 Tarjan缩点+DAG求最长链
问题描述 LG2272 BZOJ1093 题解 观察半联通的定义,发现图中的一些结点,构成的链一定是一个半联通子图. 此时存在的环可能会干扰求解,于是\(\mathrm{Tarjan}\)缩点. 于是 ...