Js+Jq获取URL参数的集中方法示例代码

获取 URL 参数是前端开发中经常用到的操作,下面是使用 JavaScript 和 jQuery 获取 URL 参数的示例代码及详细说明。

JavaScript 获取 URL 参数

1. 使用 split 方法和正则表达式分隔字符串

JavaScript 中可以使用 split 方法和正则表达式来截断字符串,然后将获取到的参数与对应的值存储在一个对象中。示例代码如下:

function getParams(str) {
  let params = {};
  let searchParams = str.split('?')[1];
  if (!searchParams) return params;
  searchParams.split('&').forEach(param => {
    let [key, value] = param.split('=');
    params[key] = value;
  });
  return params;
}

let urlParams = getParams(window.location.search);
console.log(urlParams); //输出URL参数和值的对象

2. 使用 URLSearchParams API

JavaScript 提供了一个名为 URLSearchParams 的 API,可以直接获取并解析 URL 搜索参数。示例代码如下:

let searchParams = new URLSearchParams(window.location.search);
let urlParams = Object.fromEntries(searchParams.entries());
console.log(urlParams); //输出URL参数和值的对象

jQuery 获取 URL 参数

在 jQuery 中可以使用 $.param() 方法将URL字符串转换为对象,然后通过遍历获取到的对象,将参数和对应的值存储在一个新的对象中。示例代码如下:

function getParams(url) {
  let params = {};
  let searchParams = decodeURIComponent(url).split('?')[1];
  if (!searchParams) return params;
  $.each($.param.querystring(searchParams), function(key, value) {
    params[key] = value;
  });
  return params;
}

let urlParams = getParams(window.location.search);
console.log(urlParams); //输出URL参数和值的对象

另外,如果你想直接获取当前页面 URL 的参数,可以使用 $.query.get() 方法。示例代码如下:

let urlParams = $.query.get();
console.log(urlParams); //输出URL参数和值的对象

以上是 JavaScript 和 jQuery 获取 URL 参数的示例代码和方法,可以根据实际需求选择使用。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:Js+Jq获取URL参数的集中方法示例代码 - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • 基于JavaScript实现密码框验证信息

    关于“基于JavaScript实现密码框验证信息”的完整攻略,介绍如下: 1. 确定密码验证的具体需求 在实现密码框验证信息前,首先需要明确密码验证的具体需求,例如: 密码长度是否需要限制? 密码是否需要包含特定的字符、数字、大小写字母、符号等要素? 密码是否需要与确认密码保持一致? 密码校验失败时需要如何提示用户? 透彻地明确这些细节,才能更好地编写 Ja…

    JavaScript 2023年6月10日
    00
  • js通过Date对象实现倒计时动画效果

    下面就是“js通过Date对象实现倒计时动画效果”的完整攻略。 什么是倒计时动画效果? 倒计时动画效果,是指在一定时间内,从一个数字不断递减到另一个数字的动态效果,通常用于日期倒计时、秒杀倒计时等场景。 怎么通过Date对象实现倒计时动画效果? 在JavaScript中,Date对象可以获取当前时间、日期等信息。通过获取该时间的时、分、秒等信息,并将倒计时目…

    JavaScript 2023年5月27日
    00
  • ascii码表(二进制 十进制 十六进制)详细介绍

    ASCII码表(二进制、十进制、十六进制)详细介绍 什么是ASCII码表? ASCII码表(American Standard Code for Information Interchange)是一种用于将字符编码为数字的字符编码标准。它最初是在美国为电传打字机而设计的,但现在已经成为计算机系统和通信设备中使用的标准字符集。 ASCII码表的编码方式 ASC…

    JavaScript 2023年5月19日
    00
  • JS生成随机字符串的多种方法

    JS生成随机字符串的多种方法 在JS中,生成随机字符串是常见的需求。我们可以使用多种方法来实现这个需求,下面介绍几种常见的方法。 使用Math.random()方法生成随机字符串 Math.random()方法返回一个0到1之间的随机数。我们可以使用这个方法将结果转换成字符串,然后截取字符串来生成随机字符串。 其中,Math.random()方法返回的是一个…

    JavaScript 2023年5月28日
    00
  • 详解JavaScript中的Unescape()和String() 函数

    详解JavaScript中的Unescape()和String() 函数 Unescape() 函数 Unescape() 是JavaScript中的一个函数,它将一个字符串转换为一个未经编码的字符串。在URL编码中,URL中的特殊字符将被替换为百分号(%)后跟两个十六进制数字。Unescape()函数能够将这些URL编码的特殊字符解码回原始字符。例如,%2…

    JavaScript 2023年5月19日
    00
  • js获取触发事件元素在整个网页中的绝对坐标(示例代码)

    正常情况下,通过JavaScript获取元素坐标有两种方式:相对于视口的位置(即viewport)和相对于文档的位置。获取相对于整个文档的坐标,也被称为获取元素的绝对坐标。 方法一:使用element.getBoundingClientRect() element.getBoundingClientRect()可以返回元素的大小及其相对于视口的位置。该方法返…

    JavaScript 2023年6月10日
    00
  • JavaScript开发的七个实用小技巧(很有用)

    下面是“JavaScript开发的七个实用小技巧(很有用)”的完整攻略。 1. 使用数组的slice方法复制一个数组 有时候我们需要将一个数组完整地复制到另一个数组中。在JavaScript中,我们可以使用slice方法来完成这个任务。 const arr1 = [1, 2, 3, 4, 5]; const arr2 = arr1.slice(); cons…

    JavaScript 2023年5月17日
    00
  • JavaScript 数组常见操作技巧

    JavaScript 数组常见操作技巧 JavaScript 中的数组是非常常见和重要的数据结构之一,常用于存储和处理一系列的数据。在实际的开发中,经常需要对数组进行各种各样的操作,以下是 JavaScript 数组常见的操作技巧: 创建数组 在 JavaScript 中,可以通过以下方式创建数组: 直接量方式 直接将元素放在方括号中,以逗号分隔 var a…

    JavaScript 2023年5月18日
    00
合作推广
合作推广
分享本页
返回顶部