js 获取地址栏参数 封装方法

news/2024/11/26 23:47:50/

下面是一个 JavaScript 函数,用于获取 URL 中的参数并以对象形式返回:

//获取地址栏参数(返回对象)function getUrlParams() {var urlParams = {};var queryString = window.location.search;if (queryString) {queryString = queryString.replace(/^\?/, '');var paramPairs = queryString.split('&');for (var i = 0; i < paramPairs.length; i++) {var pair = paramPairs[i].split('=');var key = decodeURIComponent(pair[0]);var value = decodeURIComponent(pair[1] || '');urlParams[key] = value;}}return urlParams;}

在上面的代码中,我们定义了一个名为 getUrlParams 的函数,用于获取 URL 中的参数,并返回一个包含所有参数的对象。函数内部首先使用 window.location.search 获取 URL 中的查询字符串部分(即参数部分),然后通过解析查询字符串来填充一个名为 urlParams 的对象。

具体来说,我们首先使用 replace 方法将查询字符串中开头的问号去掉,然后使用 split 方法将查询字符串拆分成多个键值对,再使用 decodeURIComponent 方法对键和值进行解码,并将它们填充到 urlParams 对象中。最后,我们将 urlParams 返回给调用方。

您可以在自己的代码中使用这个函数来获取 URL 参数,例如:

var params = getUrlParams(); // 假设 URL 为 https://example.com?name=John&age=30 
console.log(params.name); // 输出 "John" console.log(params.age); // 输出 "30"

这将会输出一个包含 URL 所有参数的对象,其中键为参数名,值为参数值。


http://www.ppmy.cn/news/1236535.html

相关文章

10个容易被忽视的FastAPI实用功能

大家好&#xff0c;FastAPI是一种现代、高性能的Python Web框架&#xff0c;用于构建Web应用程序和API。它基于Python的异步编程库asyncio和await语法&#xff0c;以及类型注解和自动文档生成等特性&#xff0c;提供了快速、易用和可靠的开发体验&#xff0c;接下来本文将介绍1…

Quartz .Net 的简单使用

参考了&#xff1a;c# .net framework 4.5.2 , Quartz.NET 3.0.7 - runliuv - 博客园 (cnblogs.com) https://www.cnblogs.com/personblog/p/11277527.html&#xff0c; Quartz.NET 作业调度&#xff08;一&#xff09;&#xff1a;Test - 简书 自己要轮询的任务&#xff1a…

完美解决:yum -y install nginx 报出 没有可用软件包 nginx。错误:无须任何处理

目录 一、问题&#xff1a; 二、原因&#xff1a; 三、解决方法&#xff1a; 一、问题&#xff1a; [rootlocalhost ~]# yum -y install nginx 已加载插件&#xff1a;fastestmirror Loading mirror speeds from cached hostfile * base: mirrors.bfsu.edu.cn * extras: m…

Nodejs JavaScript 字符串加密

情景 问题的场景是这样的&#xff1a;我们需要在浏览器cookie中存储用户名&#xff0c;但又不想直接明文存储&#xff0c;所以对它进行了简单的加密存储。 因为是简单的加密&#xff0c;目的只是不希望明文存储。我们使用了Base64 编码&#xff0c;使得cookie里的存储不可只读…

Laravel 安装(笔记一)

目录 第一步、Laravel 一般使用 composer安装 第二步、使用composer安装项目 第三步、配置环境 第四步、访问域名&#xff0c;安装完成 Laravel 官网 l​​​​​​​Installation - Laravel 中文网 为 Web 工匠创造的 PHP 框架 第一步、Laravel 一般使用 composer安装 如…

【Exception】Error: Dynamic require of “path“ is not supported

Talk is cheap, show me the code. 环境 | Environment kversionOSwindows 11Node.jsv18.14.2npm9.5.0vite5.0.0vue3.3.8 报错日志 | Error log >npm run dev> app10.0.0 dev > viteERROR failed to load config from C:\code\frontend\app1\vite.config.js …

Docker start/stop/restart 命令

docker start&#xff1a;启动一个或多个已经被停止的容器。 docker stop&#xff1a;停止一个运行中的容器。 docker restart&#xff1a;重启容器。 语法 docker start [OPTIONS] CONTAINER [CONTAINER...]docker stop [OPTIONS] CONTAINER [CONTAINER...]docker restart…

【华为OD题库-031】比赛的冠亚季军-java

题目 有N(3<N<10000)个运动员&#xff0c;他们的id为0到N-1,他们的实力由一组整数表示。他们之间进行比赛&#xff0c;需要决出冠亚军。比赛的规则是0号和1号比赛&#xff0c;2号和3号比赛&#xff0c;以此类推&#xff0c;每一轮&#xff0c;相邻的运动员进行比赛&#…