浅析JS获取url中的参数实例代码

首先,获取URL中的参数是Web开发经常需要的功能。JavaScript提供了多种方式可以获取URL参数,本文将介绍其中两种最常见的方式:URLSearchParams和正则表达式。

使用URLSearchParams

URLSearchParams是一个原生对象,主要用来操作URL查询参数。使用URLSearchParams获取URL参数非常方便。

我们可以用如下代码创建一个URLSearchParams对象:

const urlParams = new URLSearchParams(window.location.search);

这个新建的URLSearchParams对象会自动从当前网页的URL中获取查询参数。如果你想获取另外一个链接中的参数,只需把该链接作为参数传递给URLSearchParams构造函数即可。

一旦我们有了urlParams对象,我们就可以通过调用get()、getAll()、has()、set()、delete()、keys()、values()和entries()方法对其进行查询和修改。下面是几个例子。

获取指定参数的值

const myParam = urlParams.get('myParam');
console.log(myParam);

检查是否存在参数

if (urlParams.has('myParam')) {
    // do something
}

使用正则表达式

虽然URLSearchParams是一种非常方便的获取URL参数的方法,但有些时候我们还是需要使用正则表达式来取得它们。

下面是一些正则表达式的示例。

获取所有参数

const url = window.location.href;
const pattern = /[?&](\w+)=([^&#]*)/g;
let params = {};
let match;
while (match = pattern.exec(url)) {
    params[match[1]] = decodeURIComponent(match[2]);
}
console.log(params);

获取指定参数的值

function getParameterByName(name, url = window.location.href) {
    name = name.replace(/[\[\]]/g, '\\$&');
    const regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)');
    const results = regex.exec(url);
    if (!results) {
        return null;
    }
    if (!results[2]) {
        return '';
    }
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
console.log(getParameterByName('myParam'));

以上就是使用URLSearchParams和正则表达式获取URL参数的MarkDown文档攻略,希望对您有所帮助。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:浅析JS获取url中的参数实例代码 - Python技术站

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

相关文章

  • MVC+DAO设计模式下的设计流程详解

    MVC+DAO 是一种常用的设计模式,用于规范化代码的开发和维护,它能够分层,直观地体现出每一层的职责。下面是基于 MVC+DAO 设计模式的完整攻略: 1. MVC设计模式 MVC 分为 Model、View、Controller 三个部分。其中: Model:负责数据的存储和管理,不关心具体的业务逻辑,同样也不关心将数据如何展示给用户。 Controll…

    Java 2023年6月16日
    00
  • Java陷阱之assert关键字详解

    Java陷阱之assert关键字详解 引言 在Java程序开发中,assert关键字是一种非常有用的调试和测试工具。它能够帮助我们在程序运行时检查程序中的假设与约束是否被满足,从而及时发现程序中的bug。但是,assert关键字也存在着一些陷阱和误区,如果使用不当,就可能会导致程序出现各种意想不到的问题。本文将详细讲解Java中assert关键字的使用方法、…

    Java 2023年5月27日
    00
  • Tomcat中catalina.out 和 catalina.log的区别和用途详解

    Tomcat是一个基于Java的开源Web服务器,它是一种轻量级应用服务器,功能强大,广泛应用于Web应用程序的开发和部署。Tomcat中的catalina.out和catalina.log是服务器日志文件,这两个文件虽然非常重要,但作用有一些差别。 catalina.out catalina.out是Tomcat的标准输出文件,它记录了Tomcat启动、停…

    Java 2023年5月19日
    00
  • 浅析AJAX乱码及错误解决方案

    下面给出浅析AJAX乱码及错误解决方案的完整攻略。 理解AJAX乱码产生的原因 在使用AJAX过程中,当后台数据返回为非UTF-8编码格式时,中文字符就会出现乱码。这种情况出现是因为浏览器默认将AJAX的编码格式设置为“ISO-8859-1”,而在后台返回数据未使用UTF-8编码格式的时候,字符就会出现乱码。 AJAX乱码解决方案 1.在后台数据处理时修改编…

    Java 2023年6月15日
    00
  • java实现LRU缓存淘汰算法的方法

    Java实现LRU缓存淘汰算法的方法 什么是LRU缓存淘汰算法? LRU(Least Recently Used)是一种基于时间局部性原理的缓存置换策略,常用于CPU缓存、数据库缓存等场景。它的核心思想是:对于长期未被使用的缓存数据,它们被淘汰的概率更大。 在实际应用中,我们通常将缓存数据存储在一个链表中,每当我们访问缓存数据时,就将该数据移动到链表的头部,…

    Java 2023年5月19日
    00
  • java数据库唯一id生成工具类

    Java数据库唯一ID生成工具类是用于在关系型数据库中生成唯一ID的工具类。在开发中,经常需要使用唯一ID作为数据库表的主键,而使用数据库自增长的整数或GUID字符串作为主键,会存在一些问题,如分布式环境下高并发的ID生成、算法不唯一等问题。因此,使用Java数据库唯一ID生成工具类,可以解决这些问题。 下面给出一个完整的攻略,介绍如何使用Java数据库唯一…

    Java 2023年5月20日
    00
  • Java8新特性之线程安全日期类

    Java8新特性之线程安全日期类 Java8中加入的线程安全日期类提供了一种替代旧的日期类的方式,同时线程安全和可读性提升了不少。 LocalDate LocalDate类表示一个不可变的日期对象。它使我们能够以一种简单而明确的方式操纵日期。例如,我们可以使用LocalDate.now()获取当前日期,或者使用LocalDate.of()创建特定的日期。这些…

    Java 2023年5月20日
    00
  • 详解Java中native关键字

    首先我们需要了解一下Java中native关键字的含义。 Native关键字 在Java中,native关键字被用来修饰一个方法,标记这个方法是用外部语言(如C或C++)实现的。通俗地说,native表示这个方法的实现不是在Java代码中,而是在外部的二进制库中。使用native可以让Java代码与外部代码(如C++)实现交互,为Java提供了更强大的功能。…

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