当前位置： 首页 > news >正文

正则表达式相关概念及不可见高度页面的获取

news 2026/1/31 15:43:22

12.正则

概念:匹配有规律的字符串,匹配上则正确

1.正则的创建方式

构造函数创建
  		// 修饰符 igm// i 忽视 ignore// g global 全球 全局// m 换行
var reg=new RegExp("匹配的内容","修饰符")var str = "this is a Box";var reg = new RegExp("box", "igm");console.log(reg.test(str));//true
字面量的创造
  var reg = /box/igm;console.log(reg.test("this is a Box"));//true

2.正则的方法

test()条件满足,返回true,否则返回false

exec()条件满足,返回数组,不满足返回null

注意:参数为要匹配的字符串

3.字串符匹配正则的方法(4个)

  1. search()条件满足返回下标,不满足返回-1
  2. match()条件满足返回数组,条件不满足返回null
  3. split()切割,返回新的数组
  4. replace()替换.返回新的字符串

4.元字符

  1. 点(.) :代表除了换行以为的所有单个字符(一个点,表示一个字符)

  2. 星号(*):配合其他字符使用,可以让其他字符出现任意多次

  3. []:表示字符可以出现的范围

    [a-z]*表示任意0到多个a-z的字母

  4. (非字符):取反[0-9]可以有任意多个非0-9的字符

  5. +:表示至少出现一次

5.元符号

  1. \w*::匹配任意多个数字字母下划线 , \w : 等价于[a-zA-Z0-9_]
  2. \d*:\d 代表数字, 等价于 [0-9],\d* 表示任意多个数字
  3. \D:匹配非数字, 相当于[^0-9]
  4. \D{7,}: 匹配至少7个非数字, 相当于[^0-9]{7,}

6.锚元字符

  1. /^ 匹配开始,从头开始匹配
  2. $/ 匹配结尾,从结尾开始匹配
  3. \s 匹配空格
  4. 使用或模式匹配: |, | 代表或者的意思, 匹配其中一种字符串
  5. 分组模式匹配: (), ()加上小括号, 将内容进行分组, 可以作为一个整体进行多次匹配

案例

不可见区域的高度获取(封装一个getScroll方法) 固定导航栏案例

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>body {height: 2000px;}</style>
</head><body>11<br>11<script>//onscroll 滚动条事件 document.documentElement.scrollTop Left//<!DOCTYPE html>声明头使用document.documentElement.scrollTop//不带DTD  使用document.body.scrollTop//ie9+  使用window.pageYoffset//ie678// '获取'不可见区域的兼容写法function getScroll() {// 不管有没有DTD都可以使用,如果不是ie9+.执行falseif (window.pageYOffset != undefined) {return {left: window.pageXOffset,top: window.pageYOffset}// 带有DTD} else if (document.compatMode === "CSS1Compat") {return {left: document.documentElement.scrollLeft,top: document.documentElement.scrollTop}}// 不带DTD(声明头 <!DOCTYPE html>)return {left: document.body.scrollLeft,top: document.body.scrollTop}}document.onscroll = function () {console.log(document.compatMode);//带有CSS1Compat,不带DTD BackCompatvar obj = getScroll();console.log(obj);}</script>
</body></html>```

相关文章：

正则表达式相关概念及不可见高度页面的获取

12.正则 概念:匹配有规律的字符串,匹配上则正确 1.正则的创建方式 构造函数创建 // 修饰符 igm// i 忽视 ignore// g global 全球 全局// m 换行 var regnew RegExp("匹配的内容","修饰符")var str "this is a Box";var reg new RegExp(&qu…...

编程日记 2023/9/21 0:20:18

深入学习 Redis - 分布式锁底层实现原理，以及实际应用

目录 一、Redis 分布式锁 1.1、什么是分布式锁 1.2、分布式锁的基础实现 1.2.1、引入场景 1.2.2、基础实现思想 1.2.3、引入 setnx 1.3、引入过期时间 1.4、引入校验 id 1.5、引入 lua 脚本 1.5.1、引入 lua 脚本的原因 1.5.2、lua 脚本介绍 1.6、过期时间续约问题&…...

编程日记 2023/9/21 0:18:17

Hive行转列[一行拆分成多行/一列拆分成多列]

场景&#xff1a; hive有张表armmttxn_tmp&#xff0c;其中有一个字段lot_number&#xff0c;该字段以逗号分隔开多个值&#xff0c;每个值又以冒号来分割料号和数量&#xff0c;如&#xff1a;A3220089:-40,A3220090:-40,A3220091:-40,A3220083:-40,A3220087:-40,A3220086:-4…...

编程日记 2023/9/21 0:17:16

TypeScript系列之类型 string

文章の目录 背景写在最后 背景 与JavaScript不同的是&#xff0c;TypeScript使用的是静态类型&#xff0c;比如说它指定了变量可以保存的数据类型。如下面代码所示&#xff0c;如果在JavaScript中&#xff0c;指定变量可以保存的数据类型&#xff0c;会报错&#xff1a;类型注…...

编程日记 2023/9/21 0:15:14

【C++】动态内存管理 ③ ( C++ 对象的动态创建和释放 | new 运算符 为类对象 分配内存 | delete 运算符 释放对象内存 )

文章目录 一、C 对象的动态创建和释放1、C 语言 对象的动态创建和释放 的方式2、C 语言 对象的动态创建和释放 的方式 二、代码示例 - 对象的动态创建和释放 一、C 对象的动态创建和释放 使用 C 语言中的 malloc 函数 可以为 类对象 分配内存 ; 使用 free 函数可以释放上述分配…...

编程日记 2023/9/21 0:14:13

AMS爆炸来袭，上线即巅峰

1.关于首发项目Antmons(AMS)空投结果 Gate.io Startup 首发项目Antmons代币AMS于Aug15th,AM 07:00开始下单&#xff0c;24小时内下单同等对待总共有15,950人下单&#xff0c;下单总价值超过1,000万美金分发系数约为0.001640495298341。根据上线规则AMS项目认购成功&#xff0c;…...

编程日记 2023/9/21 0:13:11

是面试官放水，还是公司实在是太缺人？这都没挂，华为原来这么容易进...

华为是大企业&#xff0c;是不是很难进去啊&#xff1f;” “在华为做软件测试&#xff0c;能得到很好的发展吗&#xff1f; 一进去就有9.5K&#xff0c;其实也没有想的那么难” 直到现在&#xff0c;心情都还是无比激动&#xff01; 本人211非科班&#xff0c;之前在字节和腾…...

编程日记 2023/9/21 0:12:11

怒刷LeetCode的第2天（Java版）

目录 第一题 题目来源 题目内容 解决方法 方法一&#xff1a;滑动窗口 方法二&#xff1a;双指针加哈希表 第二题 题目来源 题目内容 解决方法 方法一&#xff1a;二分查找 方法二&#xff1a;归并排序 方法三&#xff1a;分治法 第三题 题目来源 题目内容 解…...

编程日记 2023/9/21 0:09:08

AUTOSAR汽车电子嵌入式编程精讲300篇-车载CAN总线网络的异常检测（续）

目录 车载 CAN 总线网络异常检测技术 3.1 车载 CAN 总线网络异常检测技术概述 3.1.1基于统计的异...

编程日记 2023/9/21 0:07:06

mojo安装

docker安装mojo 官网 https://developer.modular.com/login 很奇怪登录页面不显示 类似于网站劫持 docker 安装mojo带jupyterlab的方式 https://hub.docker.com/r/lmq886/mojojupyterlab 拉取镜像 docker pull lmq886/mojojupyterlab docker pull lmq886/mojojupyterlab:1.2 启…...

编程日记 2023/9/21 0:06:05

【探索Linux】—— 强大的命令行工具 P.8（进程地址空间）

阅读导航 前言一、内存空间分布二、什么是进程地址空间1. 概念2. 进程地址空间的组成 三、进程地址空间的设计原理1. 基本原理2. 虚拟地址空间 概念 大小和范围 作用 虚拟地址空间的优点 3. 页表 四、为什么要有地址空间五、总结温馨提示 前言 前面我们讲了C语言的基础知识&am…...

编程日记 2023/9/21 0:05:05

vue3 - Element Plus 切换主题色及el-button hover颜色不生效的解决方法

GitHub Demo 地址 在线预览 Element Plus 自定义主题官方文档 如果您想要通过 js 控制 css 变量&#xff0c;可以这样做&#xff1a; // document.documentElement 是全局变量时 const el document.documentElement // const el document.getElementById(xxx)// 获取 css 变…...

编程日记 2023/9/21 0:03:03

【C++面向对象侯捷】1.C++编程简介

文章目录 视频来源&#xff1a;我的百度网盘...

编程日记 2023/9/21 0:02:02

年龄大了转嵌入式有机会吗？

年龄大了转嵌入式有机会吗&#xff1f; 首先&#xff0c;说下结论&#xff1a;年龄并不是限制转行嵌入式软件开发的因素&#xff0c;只要具备一定的编程和电子基础知识&#xff0c;认真学习和实践&#xff0c;是可以成为优秀的嵌入式软件开发工程师的。最近很多小伙伴找我&…...

编程日记 2023/9/20 23:56:56

Mysql高级——索引优化和查询优化（2）

5. 排序优化 5.1 排序优化 问题&#xff1a;在 WHERE 条件字段上加索引&#xff0c;但是为什么在 ORDER BY 字段上还要加索引呢&#xff1f; 优化建议&#xff1a; SQL 中&#xff0c;可以在 WHERE 子句和 ORDER BY 子句中使用索引&#xff0c;目的是在 WHERE 子句中避免全表…...

编程日记 2023/9/20 23:55:55

SpringMVC的拦截器和JSR303的使用

目录 一、JSR303 二、拦截器&#xff08;interceptor&#xff09; 一、JSR303 1.1.什么是JSR303 JSR 303&#xff0c;它是Java EE&#xff08;现在称为Jakarta EE&#xff09;规范中的一部分。JSR 303定义了一种用于验证Java对象的标准规范&#xff0c;也称为Bean验证。 Bean验…...

编程日记 2023/9/20 23:54:54

servlet中doGet方法无法读取body中的数据

servlet中doGet方法不支持读取body中的数据。...

编程日记 2023/9/20 23:53:53

Ubuntu MongoDB账户密码设置

1.创建用户 在MongoDB中&#xff0c;可以使用db.createUser()方法来创建用户。该方法接受一个包含用户名、密码和角色等信息的文档作为参数。 // 连接到MongoDB数据库 mongo// 切换到admin数据库 use admin// 创建用户 db.createUser({user: "admin",pwd: "adm…...

编程日记 2023/9/20 23:52:53

指针进阶（3）

9. 模拟实现排序函数 这里我们使用冒泡排序算法&#xff0c;模拟实现一个排序函数&#xff0c;可以排序任意类型的数据。 这段代码可以排序整型数据&#xff0c;我们需要在这段代码的基础上进行改进&#xff0c;使得它可以排序任意类型的数据。 #define _CRT_SECURE_NO_WARN…...

编程日记 2023/9/20 23:49:46

信息检索与数据挖掘 | （二）布尔检索与倒排索引

文章目录 &#x1f4da;词项-文档关联矩阵&#x1f407;相关名词&#x1f407;词项-文档关联矩阵的布尔查询处理 &#x1f4da;倒排索引&#x1f407;关于索引&#x1f407;建立索引&#x1f407;基于倒排索引的布尔查询处理&#x1f407;查询优化 &#x1f4da;字典数据结构&a…...

编程日记 2023/9/20 23:48:45

Objective-C常用命名规范总结

【OC】常用命名规范总结 文章目录 【OC】常用命名规范总结1.类名&#xff08;Class Name)2.协议名&#xff08;Protocol Name)3.方法名&#xff08;Method Name)4.属性名&#xff08;Property Name&#xff09;5.局部变量/实例变量&#xff08;Local / Instance Variables&…...

编程新知 2025/12/14 22:33:06

连锁超市冷库节能解决方案：如何实现超市降本增效

在连锁超市冷库运营中&#xff0c;高能耗、设备损耗快、人工管理低效等问题长期困扰企业。御控冷库节能解决方案通过智能控制化霜、按需化霜、实时监控、故障诊断、自动预警、远程控制开关六大核心技术&#xff0c;实现年省电费15%-60%&#xff0c;且不改动原有装备、安装快捷、…...

编程新知 2025/11/30 16:55:29

vue3 定时器-定义全局方法 vue+ts

1.创建ts文件 路径&#xff1a;src/utils/timer.ts 完整代码&#xff1a; import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...

编程新知 2025/8/9 0:31:20

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

编程新知 2025/11/26 13:15:57

select、poll、epoll 与 Reactor 模式

在高并发网络编程领域&#xff0c;高效处理大量连接和 I/O 事件是系统性能的关键。select、poll、epoll 作为 I/O 多路复用技术的代表&#xff0c;以及基于它们实现的 Reactor 模式&#xff0c;为开发者提供了强大的工具。本文将深入探讨这些技术的底层原理、优缺点。​ 一、I…...

编程新知 2026/1/29 16:29:32

力扣-35.搜索插入位置

题目描述 给定一个排序数组和一个目标值&#xff0c;在数组中找到目标值&#xff0c;并返回其索引。如果目标值不存在于数组中&#xff0c;返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n) 的算法。 class Solution {public int searchInsert(int[] nums, …...

编程新知 2025/12/3 3:22:43

JAVA后端开发——多租户

数据隔离是多租户系统中的核心概念&#xff0c;确保一个租户&#xff08;在这个系统中可能是一个公司或一个独立的客户&#xff09;的数据对其他租户是不可见的。在 RuoYi 框架&#xff08;您当前项目所使用的基础框架&#xff09;中&#xff0c;这通常是通过在数据表中增加一个…...

编程新知 2025/12/18 8:35:12

Vite中定义@软链接

在webpack中可以直接通过符号表示src路径&#xff0c;但是vite中默认不可以。 如何实现&#xff1a; vite中提供了resolve.alias&#xff1a;通过别名在指向一个具体的路径 在vite.config.js中 import { join } from pathexport default defineConfig({plugins: [vue()],//…...

编程新知 2026/1/24 13:26:57

API网关Kong的鉴权与限流：高并发场景下的核心实践

&#x1f525;「炎码工坊」技术弹药已装填&#xff01; 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 引言 在微服务架构中&#xff0c;API网关承担着流量调度、安全防护和协议转换的核心职责。作为云原生时代的代表性网关&#xff0c;Kong凭借其插件化架构…...

编程新知 2025/9/6 9:35:29

WebRTC调研

WebRTC是什么&#xff0c;为什么&#xff0c;如何使用 WebRTC有什么优势 WebRTC Architecture Amazon KVS WebRTC 其它厂商WebRTC 海康门禁WebRTC 海康门禁其他界面整理 威视通WebRTC 局域网 Google浏览器 Microsoft Edge 公网 RTSP RTMP NVR ONVIF SIP SRT WebRTC协…...

编程新知 2026/1/20 14:26:36