js:URL、URLSearchParams解析当前页面url和查询参数

简介: js:URL、URLSearchParams解析当前页面url和查询参数

假设当前页面的url是

https://www.baidu.com/index.html?query=Tom#app

获取当前URL对象

window.location

打印出的结果

hash: '',

host: 'www.baidu.com',
hostname: 'www.baidu.com',
href: 'https://www.baidu.com/index.html?query=;Tom#app',
origin: 'https://www.baidu.com';,
pathname: '/index.html',
port: '',
protocol: 'https:';,
search: '?query=Tom',

reload()
replace()

使用 URLSearchParams 解析查询参数

var searchParams = new URLSearchParams("query=Tom");

console.log(searchParams);
// URLSearchParams { 'query' => 'Tom' }

console.log(searchParams.get("query"));
// Tom

使用实例

1、Node端示例

let href = "https://www.baidu.com/index.html?name=;Tom";

let url = new URL(href);
let name = url.searchParams.get("name");
console.log(name);
// Tom

2、 浏览器下示例

// https://www.baidu.com/index.html?name=;Tom
let url = new URL(window.location.href);
let name = url.searchParams.get("name");
console.log(name);
// Tom

参考

使用JavaScript解析URL的方法示例

            </div>
目录
相关文章
|
JavaScript 前端开发
js获取url参数值的几种方式
js获取url参数值的几种方式
|
JavaScript 前端开发 索引
JavaScript获取url网址中域名后面的部分
如何截取 url 中网站域名之后的部分,需要用到以下几个方法:
349 3
|
存储 开发框架 JavaScript
Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
518 0
Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
|
JavaScript 前端开发 Python
JavaScript写个.ts视频文件Url生成器,使用了string.padStart
JavaScript写个.ts视频文件Url生成器,使用了string.padStart
|
机器学习/深度学习 JavaScript
node.js实现遍历所有文件夹里面的js文件,提取所有的url
node.js实现遍历所有文件夹里面的js文件,提取所有的url
|
前端开发 JavaScript
前端JS截取url上的参数
文章介绍了两种前端JS获取URL参数的方法:手动截取封装和使用URLSearchParams。
408 0
|
JavaScript
【干货】js判断url是否是合法http/https
【干货】js判断url是否是合法http/https
|
JavaScript 前端开发 API
详解JS的URL()和URLSearchParams() API接口
详解JS的URL()和URLSearchParams() API接口
344 2
|
前端开发 JavaScript
使用 JavaScript 获取 URL 参数的详细指南
【2月更文挑战第26天】
15073 2
使用 JavaScript 获取 URL 参数的详细指南
|
JavaScript 前端开发
javascript获取url信息的常见方法
javascript获取url信息的常见方法
650 2