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

十二、正则表达式、元字符、替换修饰符、手势和对话框插件

news 2025/7/5 21:18:00

1. 正则表达式

1.1 基本使用

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 正则表达式（Regular Expression）是一种字符串匹配的模式（规则）⚫ 使用场景：➢ 例如验证表单：手机号表单要求用户只能输入11位的数字 (匹配)➢ 过滤掉页面内容中的一些敏感词(替换)，或从字符串中获取我们想要的特定部分(提取)--><script>// 1. 定义规则 其中/ /是正则表达式字面量;正则表达式也是对象const reg1 = /JS/const reg2 = new RegExp('JS')let str1 = 'JS学习'let str2 = 'TS学习'let str3 = '学习'// 2. 使用正则 test()方法 用来查看正则表达式与指定的字符串是否匹配,返回布尔型数据console.log(reg1.test(str1)) // trueconsole.log(reg1.test(str2)) // falseconsole.log(reg1.test(str3)) // falseconsole.log(reg2.test(str1)) // trueconsole.log(reg2.test(str2)) // falseconsole.log(reg2.test(str3)) // false</script>
</body></html>

1.2 元字符

1.2.1 边界符

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 普通字符：普通字符只能够匹配字符串中与它们相同的字符元字符(特殊字符)：是一些具有特殊含义的字符，极大提高了灵活性和强大的匹配功能(边界符 量词 范围 字符类)--><!-- 边界符: 定义位置规则，必须用什么开头，用什么结尾^ 开始 ; $ 结束 ; ^和$在一起，表示必须是精确匹配--><script>const reg1 = /JS/const reg2 = /^JS/const reg3 = /JS$/const reg4 = /^JS$/let str1 = 'JS学习'let str2 = '学习JS'let str3 = 'JS'console.log(reg1.test(str1)) // trueconsole.log(reg2.test(str1)) // trueconsole.log(reg2.test(str2)) // falseconsole.log(reg3.test(str1)) // falseconsole.log(reg3.test(str2)) // trueconsole.log(reg4.test(str2)) // falseconsole.log(reg4.test(str3)) // true</script>
</body></html>

1.2.2 量词

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 量词：用来设定某个模式重复次数 --><script>// 有开始结束,精确匹配// *：重复>=0 次const reg1 = /^钱*$/console.log(reg1.test('')) // tconsole.log(reg1.test('钱')) // tconsole.log(reg1.test('111')) // fconsole.log('-------------------')// +：重复>=1 次const reg2 = /^钱+$/console.log(reg2.test('')) // fconsole.log(reg2.test('钱')) // tconsole.log(reg2.test('钱钱')) // tconsole.log('-------------------')// ？：重复0次或1次const reg3 = /^钱?$/console.log(reg3.test('')) // tconsole.log(reg3.test('钱')) // tconsole.log(reg3.test('钱钱')) // fconsole.log('-------------------')// {n}：重复n次const reg4 = /^钱{3}$/console.log(reg4.test('钱钱')) // fconsole.log(reg4.test('钱钱钱')) // tconsole.log('-------------------')// {n,}：重复>=n 次const reg5 = /^钱{3,}$/console.log(reg5.test('钱钱')) // fconsole.log(reg5.test('钱钱钱')) // tconsole.log(reg5.test('钱钱钱钱')) // tconsole.log('-------------------')// {n,m}：重复n~m 次(包含n,m) 逗号左右两侧千万不要出现空格const reg6 = /^钱{3,5}$/console.log(reg6.test('钱钱')) // fconsole.log(reg6.test('钱钱钱')) // tconsole.log(reg6.test('钱钱钱钱钱')) // t</script>
</body></html>

1.2.3 范围

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 范围：表示字符的范围，定义的规则限定在某个范围，比如只能是英文字母，或者数字等等，用 [] 表示范围[abc] 匹配包含的单个字符。也就是只有 a || b || c 这三个单字符返回true，可以理解为多选1[a-z] 连字符。来指定字符范围。[a-z] 表示 a 到 z 26个英文字母 [^abc] 取反符。[^a-z] 匹配除了小写字母以外的字符--><script>// 单个字符// 1. 多选1const reg1 = /[abc]/console.log(reg1.test('a')) // trueconsole.log(reg1.test('ac')) // trueconsole.log(reg1.test('cd')) // trueconsole.log(reg1.test('de')) // falseconsole.log('--------------')// 2. 连字符/* ➢ [a-z] 表示 a 到 z 26个英文字母都可以➢ [a-zA-Z] 表示大小写都可以➢ [0-9] 表示 0~9 的数字都可以*/const reg2 = /[a-f]/console.log(reg2.test('a')) // trueconsole.log(reg2.test('ac')) // trueconsole.log(reg2.test('ch')) // trueconsole.log(reg2.test('hj')) // falseconsole.log('--------------')// 3. 取反符const reg3 = /[^abc]/console.log(reg3.test('a')) // falseconsole.log(reg3.test('ac')) // falseconsole.log(reg3.test('cd')) // trueconsole.log(reg3.test('de')) // true</script>
</body></html>

案例1_验证用户名

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>验证用户名案例</title><style>dt,dd {margin: 0;position: relative;}dl {display: flex;width: 600px;height: 30px;line-height: 30px;}dl dt {margin-right: 5px;}dl input {width: 269px;height: 28px;padding-left: 5px;border: 1px solid #ccc;outline: none;background: transparent;line-height: 30px;border-radius: 5px;}.tip {display: none;position: relative;width: 220px;height: 30px;margin-left: 15px;border: 1px solid #f59fb1;color: #d93c3c;text-align: center;font-size: 14px;background-color: #fff2f5;border-radius: 5px;}.tip::before {content: '';position: absolute;top: 50%;left: -6px;width: 10px;height: 10px;background-color: #fff2f5;border-left: 1px solid #f59fb1;border-bottom: 1px solid #f59fb1;transform: translateY(-50%) rotate(45deg);}span {position: absolute;top: 9px;right: 10px;width: 15px;height: 15px;}.right {background: url(./images/right.png) no-repeat;}.wrong {background: url(./images/error1.png) no-repeat;}</style>
</head><body><dl><dt>用户名:</dt><dd><input type="text" class="uname"><span></span></dd><dd class="tip">输入6~16位数字字母-_组成</dd></dl><!-- 用户名验证案例需求：用户名要求用户英文字母,数字,下划线或者短横线组成，并且用户名长度为 6~16 位 /^[a-zA-Z0-9_-]{6-16}$/--><script>const ipt = document.querySelector('.uname')const rORw = document.querySelector('span')const tip = document.querySelector('.tip')/* 拓展补充：➢ blur 事件：当元素失去焦点时触发（不论表单元素的值是否发生改变）➢ change 事件：元素失去焦点并且表单元素的值发生改变才会触发*/const reg = /^[a-zA-Z0-9-_]{6,16}$/ipt.addEventListener('change', function () {if (reg.test(this.value)) {/* rORw.classList.add('right')rORw.classList.remove('wrong') */// span只能有一个类名，right或wrong，直接className替换即可rORw.className = 'right'tip.style.display = 'none'} else {/* rORw.classList.remove('right')rORw.classList.add('wrong') */rORw.className = 'wrong'tip.style.display = 'block'}})</script>
</body></html>

1.2.4 字符类

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 字符类：某些常见模式的简写方式，区分字母和数字\d 匹配0-9之间的任一数字，相当于[0-9]\D 匹配所有0-9以外的字符，相当于[^0-9]\w 匹配任意的字母、数字和下划线，相当于[A-Za-z0-9_]\W 除所有字母、数字和下划线以外的字符，相当于[^A-Za-z0-9_]\s 匹配空格（包括换行符、制表符、空格符等），相等于[\t\r\n\v\f]\S 匹配非空格的字符，相当于[^\t\r\n\v\f] --><script>// 日期格式(简易 不规范)const reg = /^\d{4}-\d{1,2}-\d{1,2}$/console.log(reg.test('2024-11-26')) // trueconsole.log(reg.test('2025-1-1')) // true</script>
</body></html>

1.3 替换和修饰符

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 替换和修饰符replace 替换方法，可以完成字符的替换字符串.replace（/正则表达式/, '替换的文本'）修饰符约束正则执行的某些细节行为，如是否区分大小写、是否支持多行匹配等/表达式/修饰符➢ i 是单词 ignore 的缩写，正则匹配时字母不区分大小写➢ g 是单词 global 的缩写，匹配所有满足正则表达式的结果--><script>const str = '欢迎大家学习前端，相信大家一定能学好前端，都成为前端大神'// 懒惰模式(默认)，只匹配第一个，后面忽略const newStr1 = str.replace(/前端/, '鸿蒙')// replace 返回一个新的字符串，不修改原字符串console.log(str) // 欢迎大家学习前端，相信大家一定能学好前端，都成为前端大神console.log(newStr1) // 欢迎大家学习鸿蒙，相信大家一定能学好前端，都成为前端大神// g 匹配所有满足正则表达式的结果const newStr2 = str.replace(/前端/g, '鸿蒙')console.log(newStr2) // 欢迎大家学习鸿蒙，相信大家一定能学好鸿蒙，都成为鸿蒙大神</script>
</body></html>

案例2_隐藏手机号中间四位

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>隐藏手机号中间四位案例.</title><style>.wrapper {width: 840px;height: 420px;background: url(./images/bg01.jpg) no-repeat center / cover;padding: 100px 250px;box-sizing: border-box;}.wrapper strong {font-size: 50px;}.wrapper span {color: #b10e0d;}</style>
</head><body><div class="wrapper"><strong>年会抽奖</strong><h1>获奖手机号：<span class="phone">???</span></h1></div><!-- 隐藏手机号中间四位案例 --><script>let tel = '13866668888'// 把手机号利用正则利用小括号划分为三部分const reg = /^(\d{3})(\d{4})(\d{4})$/// 在replace中，$1 对应第一个小括号内容，依次类推let str1 = tel.replace(reg, '$1****$3')// ${} -- 模板字符串${变量或表达式}// 字符串重复使用：字符串.repeat(次数) 实现let str2 = tel.replace(reg, `$1${'*'.repeat(4)}$3`)document.querySelector('.phone').innerHTML = str1</script>
</body></html>

2. JS插件

2.1 AlloyFinger 手势插件

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>AlloyFinger手势插件</title><style>.nav {width: 200px;height: 40px;border: 3px solid pink;}.item {width: 250px;height: 40px;line-height: 40px;background-color: skyblue;transition: all .3s;}.active {transform: translateX(-50px);}</style>
</head><body><div class="nav"><div class="item">AlloyFinger是腾讯AlloyTeam 开发</div></div><!-- AlloyFinger 是腾讯 AlloyTeam 团队开源的超轻量级 Web 手势插件，为元素注册各种手势事件 --><!-- 将AlloyFinger库引入当前文件 --><!-- 配置new AlloyFinger(element, { // element 是给哪个元素做滑动事件swipe: function (e) {// 滑动的时候要做的事情 e.direction 可以判断上下左右滑动 Left Right 等}})--><script src="./alloy_finger.js"></script><script>const item = document.querySelector('.item')new AlloyFinger(item, {swipe: function (e) {if (e.direction === 'Left') {item.classList.add('active')} else if (e.direction === 'Right') {item.classList.remove('active')}},// 手指触摸touchStart: function () {console.log('touchStart')},// 手指移动touchMove: function () {console.log('touchMove')},// 手指移开touchEnd: function () {console.log('touchEnd')}})</script>
</body></html>

2.2 M端事件

<!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>.box {width: 300px;height: 300px;background-color: pink;}</style>
</head><body><div class="box"></div><!-- M端(移动端)有自己独特的地方。比如触屏事件 touch（也称触摸事件）。touch 对象代表一个触摸点。触摸点可能是一根手指，也可能是一根触摸笔。触屏事件可响应用户手指（或触控笔）对屏幕或者触控板操作。触屏touch事件touchstart 手指触摸到一个DOM元素时触发touchmove 手指在一个DOM元素上滑动时触发touchend 手指从一个DOM元素上移开时触发--><script>const box = document.querySelector('.box')box.addEventListener('touchstart', function () {console.log('touchstart')})box.addEventListener('touchmove', function () {console.log('touchmove')})box.addEventListener('touchend', function () {console.log('touchend')})</script>
</body></html>

2.3 a11y-dialog 对话框插件

<body><!-- 按钮 --><div class="btns"><button class="btn btn1">添加</button></div><!-- a11y --><!-- 1. 准备对话框容器 --><div class="dialog-container" id="dialog" aria-hidden="true"><!-- 2. 底部蒙层 --><div class="dialog-overlay" data-a11y-dialog-hide></div><!-- 3. 对话框结构 --><div class="dialog-content"><!-- 4. 关闭按钮 --><button type="button" class="dialog-close" data-a11y-dialog-hide>&times;</button><!-- 5. 标题 --><h1>测试对话框</h1><!-- 6. 内容 --><p>好看的对话框</p></div></div><!-- <script src="https://cdn.jsdelivr.net/npm/a11y-dialog@8/dist/a11y-dialog.min.js"></script> --><script src="./a11y-dialog.js"></script><script>const btn1 = document.querySelector('.btn1')// 获取对话框DOM容器const element = document.querySelector('#dialog')// 实例化对话框const dialog = new A11yDialog(element)btn1.addEventListener('click', function () {// 实例对话框调用 show 方法可以显示对话框dialog.show()})</script>
</body>

3. 字符串截取

  <script>const str = '我们都是前端大神啊'// 字符串截取// 1. substring// 最后一个字符console.log(str.substring(str.length - 1)) // 啊// 第一个字符console.log(str.substring(0, 1)) // 我// 2. str[] 字符串也有索引，console.log(str[0]) // 我</script>

4. 综合案例_移动端通讯录

十二、正则表达式、元字符、替换修饰符、手势和对话框插件

1. 正则表达式 1.1 基本使用 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title&g…...

编程日记 2024/11/27 9:42:36

计算机毕业设计Python+大模型美食推荐系统美食可视化美食数据分析大屏美食爬虫美团爬虫机器学习大数据毕业设计 Django Vue.js

温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 作者简介：Java领…...

编程日记 2024/11/27 9:41:34

【后端面试总结】MySQL索引

数据库索引不只一种实现方法，但是其中最具代表性，也是我们面试中遇到最多的无疑是B树。索引为什么选择B树数据量很大的查找，是不能直接放入内存的，而是需要什么数据就通过磁盘IO去获得。红黑树，AVL树等二叉查找树…...

编程日记 2024/11/27 9:39:33

[蓝桥杯 2021 省 AB2] 小平方

题目描述小蓝发现，对于一个正整数 nn 和一个小于 nn 的正整数 vv，将 vv 平方后对 nn 取余可能小于 nn 的一半，也可能大于等于 nn 的一半。请问，在 11 到 n−1n−1 中, 有多少个数平方后除以 nn 的余数小于 nn 的一半。例如&…...

编程日记 2024/11/27 9:38:31

Jmeter测试工具的安装和使用，mac版本，jmeter版本5.2.1

Jmeter测试工具的安装和使用JSON格式请求一、安装1、安装jdk包和设置java环境2、去官网下载Jmeter3、解压后，打开mac终端，进入apache-jmeter的bin文件开启jmeter 二、使用jmeter1、添加线程2、添加HTTP请求3、配置请求的协议、IP地址、端口号、请求方法…...

编程日记 2024/11/27 9:37:29

kmeans 最佳聚类个数 | 轮廓系数（越大越好）

轮廓系数越大，表示簇内实例之间紧凑，簇间距离大，这正是聚类的标准概念。簇内的样本应该尽可能相似。不同簇之间应该尽可能不相似。目的：鸢尾花数据进行kmeans聚类，最佳聚类个数是多少？ plot(iris[,1:4…...

编程日记 2024/11/27 9:36:28

【纪念365天】我的创作纪念日

过去的一年没有注意加入csdn已经有一年了。这几天翻看小猴儿的通知才发现时间来到了一年的纪念日。稍稍思索想要将这一段时间的学习到的知识以及偶然遇到的机遇做一下总结。上一次写纪念日是来到csdn128天的时候， 200天前我的学习状态是非常疯狂的。只记得我当时…...

编程日记 2024/11/27 9:32:22

Opencv+ROS实现颜色识别应用

目录一、工具二、原理概念本质三、实践添加发布话题主要代码四、成果五、总结一、工具 opencvros ubuntu18.04 摄像头二、原理概念彩色图像：RGB（红，绿，蓝） HSV图像：H&#xff0…...

编程日记 2024/11/27 9:31:21

蓝桥杯c++算法秒杀【6】之动态规划【下】（数字三角形、砝码称重(背包问题)、括号序列、异或三角：：：非常典型的必刷例题！！！）

别忘了请点个赞收藏关注支持一下博主喵！！！! ! ! ! ！ 关注博主，更多蓝桥杯nice题目静待更新:) 动态规划三、括号序列【问题描述】给定一个括号序列，要求尽可能少地添加若干括号使得括号序列变得合…...

编程日记 2024/11/27 9:30:20

C++设计模式（单例模式）

一、介绍 1.动机在软件系统中，经常有这样一些特殊的类，必须保证它们在系统中只存在一个实例，才能确保它们的逻辑正确性、以及良好的效率。如何绕过常规的构造器，提供一种机制来保证一个类只有一个实例? 这应该是类设计者的…...

编程日记 2024/11/27 9:28:17

前端---CSS（部分用法）

HTML画页面--》这个页面就是页面上需要的元素罗列起来，但是页面效果很差，不好看，为了让页面好看，为了修饰页面---》CSS CSS的作用：修饰HTML页面用了CSS之后，样式和元素本身做到了分离的效果。---》降低了代…...

编程日记 2024/11/27 9:26:14

2024年最新版Java八股文复习

最新版本Java八股文复习，每天更新一篇，博主正在持续努力更新中~~~ 一、Java基础篇1、怎么理解面向对象？简单说说封装、继承、多态三大特性？2、多态体现在哪几个方面？3、面向对象的设计原则你知道有哪些吗？4…...

编程日记 2024/11/27 9:24:10

计算机毕业设计Hadoop+Spark音乐推荐系统音乐预测系统音乐可视化大屏音乐爬虫 HDFS hive数据仓库机器学习深度学习大数据毕业设计

编程日记 2024/11/27 9:23:08

MyBatis高级扩展

一、Mapper批量映射优化: 1.需求: Mapper 配置文件很多时，在全局配置文件中一个一个注册太麻烦，希望有一个办法能够一劳永逸 2.配置方式: Mybatis允许在指定Mapper映射文件时，只指定其所在的包: <mappers><package name"c…...

编程日记 2024/11/27 9:22:06

代码美学2：MATLAB制作渐变色

效果： %代码美学：MATLAB制作渐变色 % 创建一个10x10的矩阵来表示热力图的数据 data reshape(1:100, [10, 10]);% 创建热力图 figure; imagesc(data);% 设置颜色映射为“cool” colormap(cool);% 在热力图上添加边框 axis on; grid on;% 设置热力图的颜色…...

编程日记 2024/11/27 9:18:01

浅谈- “ 变量中无符号与有符号的值转换 ”

在同一个表达式中，若同时出现无符号变量与有符号变量 ： 1、都转换为无符号类型：（注：2^324294967296）即unsigned int 的最大值 2、然后再运行表达式实例： #include <stdio.h>char fun(…...

编程日记 2024/11/27 9:17:00

【AI绘画】Midjourney进阶：色调详解（上）

博客主页： [小ᶻ☡꙳ᵃⁱᵍᶜ꙳] 本文专栏: AI绘画 | Midjourney 文章目录 💯前言💯Midjourney中的色彩控制为什么要控制色彩？为什么要在Midjourney中控制色彩？ 💯色调白色调淡色调明色调 &#x1f4af…...

编程日记 2024/11/27 9:12:55

代码管理之Gitlab

文章目录 Git基础概述场景本地修改未提交，拉取远程代码修改提交本地，远程已有新提交 GitIDEA引入Git拉取仓库代码最后位置 Git基础概述 workspace 工作区：本地电脑上看到的目录； repository 本地仓库：就是工作区中隐…...

编程日记 2024/11/27 9:10:53

防御网络攻击的创新策略

关键要点 ● 了解各种类型的网络攻击对于组织加强防御至关重要。 ● 制定敏捷的网络安全策略可帮助企业快速应对新出现的威胁。 ● 跨行业协作和威胁情报共享可以增强整体安全性。网络攻击威胁日益严重网络攻击的数量和复杂程度急剧增加，对全球组织构成了重大…...

编程日记 2024/11/27 9:09:52

C++软件设计模式之组合模式概述

组合模式（Composite Pattern）是C软件设计模式中的一种，主要用于解决对象的层次结构问题。它允许你将对象组合成树形结构来表示“部分-整体”的层次结构，使得客户端可以统一地处理单个对象和组合对象。主要用于解决的问题&#x…...

编程日记 2024/11/27 9:06:48

【Axure高保真原型】引导弹窗

今天和大家中分享引导弹窗的原型模板，载入页面后，会显示引导弹窗，适用于引导用户使用页面，点击完成后，会显示下一个引导弹窗，直至最后一个引导弹窗完成后进入首页。具体效果可以点击下方视频观看或打开下方…...

编程新知 2025/7/4 18:09:34

深度学习在微纳光子学中的应用

深度学习在微纳光子学中的主要应用方向深度学习与微纳光子学的结合主要集中在以下几个方向： 逆向设计通过神经网络快速预测微纳结构的光学响应，替代传统耗时的数值模拟方法。例如设计超表面、光子晶体等结构。特征提取与优化从复杂的光学数据中自…...

编程新知 2025/7/5 9:34:51

K8S认证|CKS题库+答案| 11. AppArmor

目录 11. AppArmor 免费获取并激活 CKA_v1.31_模拟系统题目开始操作： 1）、切换集群 2）、切换节点 3）、切换到 apparmor 的目录 4）、执行 apparmor 策略模块 5）、修改 pod 文件 6）、…...

编程新知 2025/7/5 18:14:32

java 实现excel文件转pdf | 无水印 | 无限制

文章目录目录文章目录前言 1.项目远程仓库配置 2.pom文件引入相关依赖 3.代码破解二、Excel转PDF 1.代码实现 2.Aspose.License.xml 授权文件总结前言 java处理excel转pdf一直没找到什么好用的免费jar包工具，自己手写的难度，恐怕高级程序员花费一年的事件，也…...

编程新知 2025/6/15 11:32:55

可靠性+灵活性：电力载波技术在楼宇自控中的核心价值

可靠性灵活性：电力载波技术在楼宇自控中的核心价值在智能楼宇的自动化控制中，电力载波技术（PLC）凭借其独特的优势，正成为构建高效、稳定、灵活系统的核心解决方案。它利用现有电力线路传输数据，无需额外布…...

编程新知 2025/7/4 20:32:21

服务器硬防的应用场景都有哪些？

服务器硬防是指一种通过硬件设备层面的安全措施来防御服务器系统受到网络攻击的方式，避免服务器受到各种恶意攻击和网络威胁，那么，服务器硬防通常都会应用在哪些场景当中呢？ 硬防服务器中一般会配备入侵检测系统和预防系统&#x…...

编程新知 2025/7/4 19:27:05

1.3 VSCode安装与环境配置

进入网址Visual Studio Code - Code Editing. Redefined下载.deb文件，然后打开终端，进入下载文件夹，键入命令 sudo dpkg -i code_1.100.3-1748872405_amd64.deb 在终端键入命令code即启动vscode 需要安装插件列表 1.Chinese简化 2.ros …...

编程新知 2025/7/4 20:06:41