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

表单验证和正则表达式

news 来源：原创 2025/9/14 14:06:46

表单验证

表单：收集用户信息，并把信息发送给服务器程序进行处理

what

验证数据的格式，将符合标准数据格式要求的数据，发送给后台。

对用户的输入做格式校验，确保能够发送到后台服务器的数据一定是正确的。降低服务器的压力，提高用户体验

效果实现

得焦事件

用户输入提示
失焦事件

用户输入是否为空

表单验证的特效和页面布局息息相关

作用：①在用户输入时，给与用户各种输入的反馈提示
```
 ②真正的控制 表单是否能够进行提交
```

字符串的操作 String 对象

string对象专门用来处理字符串

charAt()——返回在指定下标位置的字符

 <script>var aa='1254你好'var bb='4567哈哈'//输入下标获取改下标的值console.log(aa.charAt(4));//结果：你</script>

concat()——连接两个或更多字符串，并返回新的字符串

<script>var aa='1254你好'var bb='4567哈哈'var cc='789'//连接两个字符串，并返回一个新的字符串console.log(aa.concat(bb));console.log(aa.concat(cc));
//结果：1254你好4567哈哈// 1254你好789</script>

indexOf()——返回某个指定的子字符串值在字符串中首次出现的位置
includes()——查找字符串中是否包含指定的子字符串。是返回true，否则false
lastIndexOf()——从后向前搜索字符串，并从起始位置(0)开始计算返回字符串最后出现的位置

 <script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//查找特定字符串在整个字符串中首次出现的位置console.log(dd.indexOf('5'));//查找特定字符串在整个字符串中最后出现的位置，从后向前搜索console.log(dd.lastIndexOf('5'));//查找字符串中是否包含特殊字符串console.log(dd.includes('565'));console.log(dd.includes('你好'));
//结果： 4  14 true false</script>

replace()——用于在字符串中用一些字符替换另一些字符，或替换一个正则表达式匹配的字符串
slice()——提取字符串的片段，并在新的字符串中返回被提取的部分
split()——把字符串分割为字符串数组

<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//将特殊字符串替换到字符串中console.log(bb.replace('哈哈','你好'));console.log(bb);var ee=bb.replace('哈哈','你好')console.log(ee);//提取字符串，并返回被提取后的新的字符串console.log(dd.slice(4,11));console.log(dd);//var ff=dd.split('5654123');var ff=dd.slice(4,11);console.log(ff);//将字符串转换成数组console.log(bb.split(''));console.log(bb);var gg=bb.split('67');console.log(gg);
//结果:4567你好//4567哈哈
// 4567你好
// 5654123
// 12345654123145532
// 5654123
// ['4','5','6','7','哈','哈']
// 4567哈哈
// (2) ['45', '哈哈']</script>

startsWith()——查看字符串是否以指定的字符串开头
endsWith()——查看字符串是否以指定的字符串结尾

<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//字符串是否以特定字符串开头console.log(bb.startsWith('45'));console.log(bb.startsWith('5'));//字符串是否以特定字符串结尾console.log(bb.endsWith('哈哈'));console.log(bb.endsWith('5'));//结果：true false true false</script>

substr(起始索引，提取的长度)——从起始索引号提取字符串中指定数目的字符
substring()——提取字符串中两个指定的索引号直接的字符前闭后开

<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//起始位置，提取长度 提取字符串console.log(dd.substr(2,5));//起始位置，结束位置 提取字符串//结果：34565  345</script>console.log(dd.substring(2,5));

toLowerCase()——把字符串转换成小写
toUpperCase()——把字符串转换成大写

<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'var hh='BCNSMDLKGAL'var ii='zcffaet'//把字符串转换成小写console.log(hh.toLowerCase());//把字符串转换成大写console.log(ii.toUpperCase());
//结果：bcnsmdlkgal// ZCFFAET</script>

trim()——去除字符串两边的空格
toString()——返回一个字符串

 <script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'var hh='BCNSMDLKGAL'var ii='zcffaet'var jj=' jssfj  'var kk=parseInt(12346);//去除字符串两边的空格console.log(jj.trim());console.log(jj);//转换成字符串console.log(kk.toString());console.log(kk);</script>

正则表达式

正则表达式，又称规则表达式，通常被用来检索、替换那些符合某个模式(规则)的文本

why

有一些比较复杂的校验使用字符串提供的方法不能很好的校验，

所以使用正则进行一些复杂校验

使用

创建正则表达式
- 字面量创建 (常用)
  
  let reg = /表达式/；
- 构造函数
  
  let reg=new RegExp(‘a,c’);

有很多具有特殊函数的符号，学会各种符号所表示的含义

使用正则表达式

test()：检索字符串中是否存在指定的值。存在返回true，不存在返回false

正则表达式常用字符含义

\：转义字符，让具有特殊作用的符号，失去特殊作用，只保留本身的符号
^ ：匹配行首，以XXX开头
[ ] ：表示范围区间，只表示一个字符的范围空间

[0-9][a-z][A-Z][0-9a-zA-Z][0-9|A-Z|a-z]

* ：匹配前面的子表达式任意次
+ ：匹配前面的子表达式至少1次
? ：匹配前面的子表达式 0或1次
[^ ]：取反

[^0-9]：任意的非数字字符
[^a-z0-9A-Z]：除数字，字母之外的任意字符

| ：或者
{ }：位数

{3}:3位
{3,}:至少3位
{3,6}:3至6位

. ：匹配任意的单个字符
$：匹配末尾，以XXX结尾
g：全局匹配
i：不区分大小写
\w：任何单字字符

等价于：[a-z0-9A-Z]

\W：任何非单字字符

等价于：[^a-z0-9A-Z]

\s：任何空白符

等价于：[\t\n\r\f\v]

\S：任何非空白符

等价于：[^\t\n\r\f\v]

\d：任何数字

等价于：[0-9]

\D：除了数字之外的任何字符

等价于：[^0-9]

表单验证和正则表达式

表单验证表单：收集用户信息，并把信息发送给服务器程序进行处理 what 验证数据的格式，将符合标准数据格式要求的数据，发送给后台。对用户的输入做格式校验，确保能够发送到后台服务器的数据一定是正确的。降低服务器…...

编程日记 2025/9/14 14:06:46

汽车免拆诊断案例 | 保时捷车发动机偶发熄火故障 2 例

案例1　2008款保时捷卡宴车行驶中发动机偶发熄火故障现象　一辆2008款保时捷卡宴车，搭载4.8 L 自然吸气发动机，累计行驶里程约为21万km。车主反映，该车行驶中发动机偶发熄火；重新起动，发动机能够起动着机&#xff…...

编程日记 2025/9/14 1:51:42

MongoDB 是一个开源的文档型数据库管理系统下载安装 Windows 系统 https://blog.csdn.net/weixin_41192489/article/details/126777309 GUI工具【推荐】MongoDB Compass https://www.mongodb.com/zh-cn/docs/compass/current/ Robo 3T https://blog.csdn.net/weixin_4119248…...

编程日记 2025/9/14 14:05:58

Javaweb后端数据库多表关系一对多，外键，一对一

多表关系一对多多的表里，要有一表里的主键外键多的表上，添加外键一对一多对多案例...

编程日记 2025/9/12 21:56:58

React（10）

项目实践--创建项目在store的modules中创建相关的子仓库暴露到仓库index文件中导入creatSlice和axios 创建仓库和数据的异步修改方法 // 编写store // 导入createSlice和axios import { createSlice } from "reduxjs/toolkit"; import axios from "axios&…...

编程日记 2025/9/14 14:04:37

JAVA实战开源项目：靓车汽车销售网站(Vue+SpringBoot) 附源码

本文项目编号 T 093 ，文末自助获取源码 \color{red}{T093，文末自助获取源码} T093，文末自助获取源码目录一、系统介绍二、数据库设计三、配套教程3.1 启动教程3.2 讲解视频3.3 二次开发教程四、功能截图五、文案资料5.1 选题背景5.2 国内…...

编程日记 2025/9/8 12:28:39

【大语言模型】【整合版】DeepSeek 模型提示词学习笔记（散装的可以看我之前的学习笔记，这里只是归纳与总结了一下思路，内容和之前发的差不多）

以下是个人笔记的正文内容: 原文在FlowUs知识库上，如下截图。里面内容和这里一样，知识排版好看一点一、什么是 DeepSeek 1. DeepSeek 简介 DeepSeek 是一家专注于通用人工智能（AGI）的中国科技公司，主攻大模型研发与…...

编程日记 2025/9/2 13:32:37

网络安全扫描--基础篇

前言 1、了解互联网安全领域中日趋重要的扫描技术 2、了解在不同网络场景下扫描技术手段 3、熟悉linux下系统内核防护策略并能大件一个有效的系统防护体系 4、增强工作安全意识，并能有效的实践于工作场景中目录 1、熟悉主机扫描工具（fping，…...

编程日记 2025/9/14 3:23:57

Python网络安全脚本

🍅 点击文末小卡片 ，免费获取网络安全全套资料，资料在手，涨薪更快前言睡不着，那就起来学习其实base64模块很早之前用过今天做爬虫的时候有个URL需要用它来编码一下所以百度又学了一下遇到最大的问题就是python3和p…...

编程日记 2025/9/14 14:05:56

ElasticSearch查询指南：从青铜到王者的骚操作

ElasticSearch查询指南：从青铜到王者的骚操作本文来源于笔者的CSDN原创，由于掘金>已经去掉了转载功能，所以只好重新上传，以下图片依然保持最初发布的水印（如CSDN水印）。（以后属于本人原创均…...

编程日记 2025/9/14 14:02:22

四、详细解释：网络与连接操作命令

1. ping – 测试网络连通性用途：检查与目标主机之间的网络连接是否通畅。语法： ping [选项] 目标IP或域名常用选项： -c 次数：指定发送数据包的次数（默认无限次，需手动 CtrlC 终止）。-i 秒数&…...

编程日记 2025/9/12 1:17:08

前端关于Cursor编辑器的了解与深度使用及对工作的便利

1. 什么是 Cursor 编辑器？ Cursor 是一款基于 AI 的现代代码编辑器，类似于 VS Code，但内置了强大的 AI 功能。它的核心目标是帮助开发者更快、更智能地编写代码。主要特点： AI 驱动的代码补全：提供上下文相关的智能代码建议。代码生成与修复：通过自然语言描述生成代码…...

编程日记 2025/9/11 17:19:48

Java Junit框架

JUnit 是一个广泛使用的 Java 单元测试框架，用于编写和运行可重复的测试。它是 xUnit 家族的一部分，专门为 Java 语言设计。JUnit 的主要目标是帮助开发者编写可维护的测试代码，确保代码的正确性和稳定性。 JUnit 的主要特点注解驱动&…...

编程日记 2025/9/13 18:57:57

高级自动化测试常见面试题（Web、App、接口）

一、Web自动化测试 1.Selenium中hidden或者是display ＝ none的元素是否可以定位到？ 不能,可以写JavaScript将标签中的hidden先改为0，再定位元素 2.Selenium中如何保证操作元素的成功率？也就是说如何保证我点击的元素一定是可以…...

编程日记 2025/9/14 14:04:36

京准电钟解读：为何不能用网络上的NTP时间源服务器

京准电钟解读：为何不能用网络上的NTP时间源服务器京准电钟解读：为何不能用网络上的NTP时间源服务器通常是因为以下几个方面的原因： 安全性问题： NTP服务器可能被黑客操纵或成为攻击的目标，如果服务器被攻破&…...

编程日记 2025/9/8 19:55:53

Android OpenGLES2.0开发（十一）：渲染YUV

人生如逆旅，我亦是行人 Android OpenGLES开发：EGL环境搭建Android OpenGLES2.0开发（一）：艰难的开始Android OpenGLES2.0开发（二）：环境搭建Android OpenGLES2.0开发（三&am…...

编程日记 2025/9/8 13:22:49

7种内外网数据交换方案全解析哪种安全、高效、合规？

内外网数据交换方案主要解决了企业跨网络数据传输中的安全、效率与合规性问题。通过采用先进的加密技术、高效的数据传输协议以及严格的审批和审计机制，该方案确保了数据在内外网之间的安全交换，同时提高了传输效率，并满足了企业对数据合规性…...

编程日记 2025/9/14 8:23:25

详解：事务注解 @Transactional

创作内容丰富的干货文章很费心力，感谢点过此文章的读者，点一个关注鼓励一下作者，激励他分享更多的精彩好文，谢谢大家！ Transactional 是 Spring Framework 中常用的注解之一，它可以被用于管理事务。通过使…...

编程日记 2025/9/13 22:59:33

2025最新Flask学习笔记（对照Django做解析）

前言：如果还没学Django的同学，可以看Django 教程 | 菜鸟教程，也可以忽略下文所提及的Django内容；另外，由于我们接手的项目大多都是前后端分离的项目，所以本文会跳过对模板的介绍，感兴趣的朋友可…...

编程日记 2025/9/12 13:55:14

大模型面试问题准备

1. BERT的多头注意力为什么需要多头？ 为了捕捉不同子空间的语义信息，每个头关注不同的方面，增强模型的表达能力 2. 什么是softmax上下溢出问题？ 问题描述： 上溢出：ye^x中，如果x取非常大的正数…...

编程日记 2025/9/14 14:04:38

FFmpeg 命令行全解析：高效音视频处理从入门到精通

FFmpeg FFmpeg 是一款开源的多媒体处理工具集，支持音视频编解码、格式转换、流媒体处理等全链路操作。核心功能与工具: 多媒体全链路支持支持 1000+ 音视频编解码格式（如 H.264、HEVC、AV1）和协议（RTMP、RTSP、HLS），覆盖录制、转码、流化等全流程。提供三大核心工具： …...

编程日记 2025/9/14 14:03:35

在使用LomBok时编译器弹出java: 错误: 不支持发行版本 5该怎么解决的四种方案

你遇到的错误 java: 错误: 不支持发行版本 5 表明你的代码正在尝试使用 Java 5 或更早版本的编译器，而这些版本已经不再受支持，并且可能与你当前使用的 JDK 版本不兼容。以下是解决此问题的步骤： 1. 检查项目语言级别确保你的项目配置为使…...

编程日记 2025/9/9 0:32:03

【数据结构】(12) 反射、枚举、lambda 表达式

一、反射 1、反射机制定义及作用反射是允许程序在运行时检查和操作类、方法、属性等的机制，能够动态地获取信息、调用方法等。换句话说，在编写程序时，不需要知道要操作的类的具体信息，而是在程序运行时获取和使用。 2、反射机制…...

编程日记 2025/9/14 14:03:35

在VSCode中安装jupyter跑.ipynb格式文件

个人用vs用的较多，不习惯在浏览器单独打开jupyter，看着不舒服，直接上教程。 1、在你的环境中pip install ipykernel 2、在vscode的插件中安装jupyter扩展 3、安装扩展后，打开一个ipynb文件，并且在页面右上角配置内核 …...

编程日记 2025/9/14 14:06:44

WordPress网站502错误全面排查与解决指南

502 Bad Gateway错误是WordPress站长最常遇到的服务器问题之一，它意味着服务器作为网关或代理时，未能从上游服务器获取有效响应。针对WP可能出现的502问题，本文提供一些基础到进阶的解决方案供大家参考:) 一、502错误的本质和核心诱因 502错误属于HTTP状态码中的5xx系列，…...

编程日记 2025/9/9 17:53:31

锂电池保护板测试仪：电池安全的守护者与创新驱动力

在新能源产业蓬勃发展的今天，锂电池以其高能量密度、长循环寿命和环保特性，成为电动汽车、无人机、便携式电子设备等领域不可或缺的能量来源。然而，锂电池的安全性和稳定性一直是行业关注的焦点。为了确保锂电池在各种应用场景下的可靠运行&a…...

编程日记 2025/9/14 14:05:55

flowable-ui 的会签功能实现

场景：在进行智慧保时通开发时，有个协作合同入围功能，这个功能的流程图里有个评审小组，这个评审小组就需要进行会签操作，会签完成后，需要依据是否有不通过的情况选择下一步走的流程思考步骤： 首…...

编程日记 2025/9/11 1:25:53

Python学习第十七天之PyTorch保姆级安装

PyTorch安装与部署一、准备工作二、pytorch介绍三、CPU版本pytorch安装1. 创建虚拟环境2. 删除虚拟环境1. 通过环境名称删除2. 通过环境路径删除 3. 配置镜像源4. 安装pytorch1. 首先激活环境变量2. 进入pytorch官网，找到安装指令 5. 验证pytorch是否安装成功四、…...

编程日记 2025/9/14 14:04:37

Kibana：Spotify Wrapped 第二部分：深入挖掘数据

作者：来自 Elastic Philipp Kahr 我们将比以往更深入地探究你的 Spotify 数据并探索你甚至不知道存在的联系。在由 Iulia Feroli 撰写的本系列的第一部分中，我们讨论了如何获取 Spotify Wrapped 数据并在 Kibana 中对其进行可视化。在第 2 部分中&#…...

编程日记 2025/9/9 19:22:49

半导体晶圆精控：ethercat转profient网关数据提升制造精度

数据采集系统通过网关连接离子注入机，精细控制半导体晶圆制造过程中的关键参数。在半导体制造中，晶圆制造设备的精密控制是决定产品性能的关键因素。某半导体工厂采用耐达讯Profinet转EtherCAT协议网关NY-PN-ECATM，将其数据采集系统与离子注…...

编程日记 2025/9/12 12:17:36

CMake小结2（PICO为例）

1 前言之前写过一篇cmake，不过很简单：CMake小结_cmake ${sources}-CSDN博客构建系统现在真的太多了，完全学不过来的感觉，meson，gardle，buildroot， Maven。。。我是真的有点放弃治疗了。之前…...

编程日记 2025/9/14 14:04:36

5. Go 方法(结构体的方法成员)

Go语言没有传统的 class ，为了让函数和结构体能够关联，Go引入了“方法”的概念。当普通函数添加了接收者（receiver）后，就变成了方法。一、函数和方法示例 // 普通函数 func Check(s string) string {return s }//…...

编程日记 2025/9/14 14:06:45

Linux查看和处理文件内容

1.文本文件有字符集编码的文件如：ASCII、UTF-8、Unicode、ANSI等常见的文本文件 txt、xml、conf、properties、yml等配置文件、日志文件、源代码 2.二进制文件除文本文件外的文件如：可执行程序、图片、音频、视频 3.cat 格式：…...

编程日记 2025/9/14 14:05:58

关于网络端口探测：TCP端口和UDP端口探测区别

网络端口探测是网络安全领域中的一项基础技术，它用于识别目标主机上开放的端口以及运行在这些端口上的服务。这项技术对于网络管理和安全评估至关重要。在网络端口探测中，最常用的两种协议是TCP（传输控制协议）和UDP（用…...

编程日记 2025/9/13 19:43:13

Spring IoC和DI

Spring IoC和DI 1 IOC1.1 什么是IoC？1.2 IoC 介绍1.2.1 传统程序开发1.2.2 问题分析1.2.3 IoC程序开发1.2.3 IoC 优势 1.3 DI 介绍 2. IoC & DI 使⽤IoC 详解Bean的存储1.1 Controller（控制器存储） 1.2 Service（服务存储&…...

编程日记 2025/9/13 5:09:08

centos9之ESXi环境下安装

一、centos9简介 CentOS Stream 9是一个基于RHEL（Red Hat Enterprise Linux）的开源操作系统。它是CentOS Stream系列的最新版本。CentOS Stream是一个中间发行版，位于RHEL和Fedora之间，旨在提供更及时的软件更新和新功能。CentOS …...

编程日记 2025/9/8 18:18:04

【论文学习】基于规模化Transformer模型的低比特率高质量语音编码

以下文章基于所提供的文档内容撰写，旨在对该论文“Scaling Transformers for Low-Bitrate High-Quality Speech Coding”进行较为系统和深入的分析与总结。论文地址：https://arxiv.org/pdf/2411.19842 一、研究背景与动机自20世纪70年代以来&#xff…...

编程日记 2025/9/13 10:24:20

Docker 2025/2/24

用来快速构建、运行和管理应用的工具。帮助部署。快速入门代码略解释 docker run :创建并运行一个容器，-d是让容器在后台运行 --name mysql :给容器起个名字，必须唯一 -p 3306:3306 :设置端口映射 -e KEYVALUE :是设置环境变量 mysql :指定运行的…...

编程日记 2025/9/9 21:49:13

Rust语言基础知识详解【一】

1.在windows上安装Rust Windows 上安装 Rust 需要有 C 环境，以下为安装的两种方式： 1. x86_64-pc-windows-msvc（官方推荐） 先安装 Microsoft C Build Tools，勾选安装 C 环境即可。安装时可自行修改缓存路径与安装路…...

编程日记 2025/9/14 4:38:29

Kronecker分解（K-FAC）：让自然梯度在深度学习中飞起来

Kronecker分解（K-FAC）：让自然梯度在深度学习中飞起来在深度学习的优化中，自然梯度下降（Natural Gradient Descent）是一个强大的工具，它利用Fisher信息矩阵（FIM）调整梯度…...

编程日记 2025/9/14 0:04:08

Ubutu部署WordPress

前言什么是word press WordPress是一种使用PHP语言开发的建站系统，用户可以在支持PHP和MySQL数据库的服务器上架设WordPress。它是一个开源的内容管理系统（CMS），允许用户构建动态网站和博客。现在的WordPress已经强大到几乎可以…...

编程日记 2025/9/14 9:10:45

请解释 React 中的 Hooks，何时使用 Hooks 更合适？

一、Hooks 核心理解 1. 什么是 Hooks？ Hooks 是 React 16.8 引入的函数式编程范式，允许在函数组件中使用状态管理和生命周期能力。就像给函数组件装上了"智能芯片"，让原本只能做简单展示的组件具备了处理复杂逻辑的能力。 2. 类…...

编程日记 2025/9/10 15:57:55

在Linux桌面上创建Idea启动快捷方式

1、在桌面新建idea.desktop vim idea.desktop [Desktop Entry] EncodingUTF-8 NameIntelliJ IDEA CommentIntelliJ IDEA Exec/home/software/idea-2021/bin/idea.sh Icon/home/software/idea-2021/bin/idea.svg Terminalfalse TypeApplication CategoriesApplication;Developm…...

编程日记 2025/9/13 9:03:55