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

JavaWeb系列三: JavaScript学习 下

JavaScript学习

  • 数组学习
    • 数组定义
    • 数组使用和遍历
  • js函数快速入门
    • 函数定义方式
      • 方式1: function关键字定义函数
      • 方式2: 将函数赋给变量
  • js函数注意事项和细节
    • js函数练习
  • js自定义对象
    • 方式1: Object形式
    • 方式2: {}形式
  • 事件
    • 基本介绍
    • 事件分类
    • onload加载完成事件
    • onclick单击事件
    • onblur失去焦点事件
    • onchange内容发生改变事件
    • onsubmit表单提交事件
    • 表单作业

在这里插入图片描述


⬅️ 上一篇: JavaWeb系列三: JavaScript学习 上


🎉 欢迎来到 JavaWeb系列三: JavaScript学习 下 🎉

在本篇文章中,我们将继续深入学习 JavaScript,探索更多高级特性和实用功能。通过进一步学习 JavaScript,您可以更加灵活地实现网页的动态效果和交互功能。


🔧 本篇需要用到的项目: javascript-demo项目


数组学习

数组定义

1.应用实例, 创建array_define.html, 演示js数组定义使用的4种方式.

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>数组定义</title><script type="text/javascript">//数组定义的第一种方式var car = ["奔驰", 100, "奥迪", true, "宝马", 300.24];console.log("car=", car);console.log("car[0]", car[0]);//表示访问car数组的第一个元素, 0代表索引, 索引从0开始//数组定义的第二种方式var car = [];//空数组(但是在java中要指定大小)//添加元素car[0] = "奔驰";car[1] = "宝马";car[2] = "奥迪";console.log("car=", car);console.log("car[1]", car[1]);console.log("car[2]", car[2]);console.log("car[10]", car[10]);//访问第11个元素, 如果该元素不存在, 返回undefined//数组定义的第三种方式var car = new Array("奔驰", "宝马", "比亚迪");console.log("car=", car);//数组定义的第四种方式var car = new Array();console.log(typeof car);//objectcar[0] = "奔驰";car[1] = "宝马";console.log("car=", car);car[1] = "比亚迪";//相当于数组替换car[2] = "奥迪";//相当于数组扩容car[7] = "红旗";//扩容, 如果跳过了中间的下标索引, 进行扩容, 那么中间未定义的值为undefinedconsole.log("car[3]", car[3]);//undefinedconsole.log("car=", car);//car= Array(8) [ "奔驰", "比亚迪", "奥迪", <4 empty slots>, "红旗" ]</script>
</head>
<body></body>
</html>

数组使用和遍历

1.应用实例 创建traversal-array.html, 演示js的数组遍历

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>数组遍历(traversal)和使用</title><script type="text/javascript">var car = ["奔驰", 60000.00, "宝马", true, "奥迪", null];//数组遍历console.log("数组car的长度=", car.length);//6for (var i = 0; i < car.length; i++) {console.log("car[" + i + "]=" + car[i]);//log()方法会自动换行}</script>
</head>
<body></body>
</html>

js函数快速入门

一句话: 函数是由事件驱动的, 或者当它被调用时, 执行的可重复使用的代码块.

需求: 演示js函数的基本使用

应用案例
创建 simple_function.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>js函数入门</title><script type="text/javascript">//定义一个简单的函数//如果不去调用函数, 那么该函数是不会被执行的//在js中如果要执行函数, 有两种方式, 1.主动调用hi(); 2.事件触发function hi() {console.log("hello, 你好");}hi();</script>
</head>
<body>
<!--这里表示给这个button绑定了一个onclick事件当用户点击了该button, 就会触发hi()函数
-->
<button onclick="hi()">点击这里, 触发函数</button>
</body>
</html>

函数定义方式

方式1: function关键字定义函数

1.基本语法
function 函数名(形参列表) {
        函数体
        return 表达式
}
//调用 函数名(参数列表);

2.应用实例 创建 1.function-use.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>js函数定义方式一</title><script type="text/javascript">//1.定义没有返回值的函数function f1() {console.log("f2() 被调用...")}f1();//2.定义有形参的函数//这里的形参不需要指定类型, name的数据类型是由实参决定的function f2(name) {console.log(typeof name);//number, object, null, stringconsole.log("f2() 被调用...", name);}f2();//3.定义有形参和返回值的函数, 不需要指定返回类型, 返回类型由返回的数据决定//js函数的调用机制和java一样function f3(n1, n2) {return n1 + n2;}console.log("f3(10, 20)结果=", f3(10, 20));</script>
</head>
<body></body>
</html>

方式2: 将函数赋给变量

1.基本语法
var 函数名 = function(形参列表) {
        函数体
        return 表达式
}
//调用 函数名(实参列表);

2.应用实例 2.function-use.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>js函数使用方式二</title><script type="text/javascript">var f1 = function () {console.log("f1函数被调用...");}console.log(typeof f1);//functionf1();//调用函数var f2 = f1;f2();var f3 = function (name) {console.log("f3(name)=", name)}f3("赵志伟");var f4 = function (n1, n2) {return n1 + n2;}console.log("f4(1, 2)结果=", f4(1, 2));</script>
</head>
<body></body>
</html>

js函数注意事项和细节

1.js中, 函数的重载会覆盖掉上一次的定义.

2.函数的arguments隐形参数(作用于在function函数内).

(1)隐形参数: 在function函数中不需要定义, 可以直接来获取所有参数的变量.

(2)js中的隐形参数特别像java的可变参数一样, 操作类似数组.

3.应用实例 创建function-detail.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>函数使用注意事项和细节</title><script type="text/javascript">//1.js中函数的重载会覆盖掉上一次的定义//解读//(1)js中函数的重载会覆盖掉上一次的定义//(2)当你调用f1()时, 其实调用的是f1(name)这个方法//(3)调用f1(name)时, 如果你没有传入实参, 那么这个name就是undefinedfunction f1() {console.log("f1()")}function f1(name) {console.log("f1(name)=", name)}f1();//2.函数的arguments隐形参数(作用域在function函数内)//(1)隐形参数: 在function函数中不需要定义, 可以直接用来获取所有参数的变量.function f2() {//(2)遍历: 函数的arguments 隐形参数//(3)注意 arguments 是数组//(4)提示: 如果我们希望通过console.log输出对象的数组, 使用逗号连接, 而不是+console.log(arguments);//可以console.log("arguments=", arguments);//可以console.log("arguments=" + arguments);//这里不能使用+连接//(5)可以把arguments参数当作数组来使用for (var i = 0; i < arguments.length; i++) {console.log(arguments[i]);}}f2(1, 2.5, "me");//3.小细节//(1)如果我们的函数有形参, 在传入实参的时候, 仍然按照顺序匹配//(2)如果匹配上, 就赋给它, 如果没有匹配上, 也无所谓//(3)最后仍然会把所有的实参, 赋给 arguments//(4)如果形参个数大于了实参个数, 则该形参的值为 undefinedfunction f3(n) {console.log("n=", n);//100console.log("arguments=", arguments);//arguments= Arguments { 0: 100, 1: 200, 2: 300, … }}f3(100, 200, 300);</script>
</head>
<body></body>
</html>

js函数练习

1.需求: 编写一个函数, 用于计算所有参数相加的和并返回, 如果实参不是number, 就过滤掉.

2.提示: 使用typeof(变量)来判断参数类型

3.应用实例 创建function-exercise.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>js函数练习</title><script type="text/javascript">function getSum() {var sum = 0;//变量初始化for (var i = 0; i < arguments.length; i++) {console.log("arguments[i]=", arguments[i], typeof (arguments[i]));}for (var i = 0; i < arguments.length; i++) {if (typeof (arguments[i]) == "number") {sum += arguments[i];}}return sum;}var sum = getSum("房子", 10000, "车子", 30000, "电脑", 5000);console.log("sum=", sum);</script>
</head>
<body></body>
</html>

js自定义对象

方式1: Object形式

1.对象的定义
var 对象名 = new Object();//对象实例(空对象)
对象名.属性名 = 值;//定义一个属性
对象名.函数名 = function() {}//定义一个函数

2.对象访问
对象名.属性
对象名.函数名()

3.应用实例 创建1.object_difine.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>自定义对象方式一</title><script type="text/javascript">//自定义对象方式一//person是一个空对象, 没有自定义的函数和属性var person = new Object();//built-inconsole.log("person类型=", typeof person);//object//增加一个属性person.name = "赵志伟";//增加一个属性ageperson.age = 23;//增加一个函数person.hi = function () {//这里的this就是当前的personconsole.log("person信息 ", this.name, this.age);};//访问属性console.log("person.name=", person.name);//访问方法person.hi();//小细节: 如果没有定义某个属性, 直接使用, 就会出现, 变量提升(专业术语), 显示undefinedconsole.log("person.address=", person.address);//undefined//方法不能提升console.log("person.say=", person.say());</script>
</head>
<body></body>
</html>

方式2: {}形式

1.对象的定义
var 对象名 = {
        属性名: 值,//定义属性
        属性名: 值,//定义属性 注意有,号
        函数名: function() {}//定义函数
}

2.对象访问
对象名属性
对象名.函数名()

3.应用实例 创建2.function_define.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>自定义对象方法二</title><script type="text/javascript">//演示自定义对象方法二var person = {name: "赵志伟",//多个属性之间用,隔开age: 23,hi: function () {console.log("person信息=", this.name, this.age);},sum: function (n1, n2) {return n1 + n2;}};//使用console.log("person=", person);console.log("person.name=", person.name + ", person.age=", person.age);person.hi();console.log("person.sum(10,20)=", person.sum(10, 20));</script>
</head>
<body></body>
</html>

事件

基本介绍

1.事件是电脑输入设备与页面进行交互的响应.

2.事件通常与函数配合使用, 这样就可以通过发生的事件来驱动函数执行.

3.js事件文档地址: https://www.w3school.com.cn/js/js_events.asp

4.事件一览表

在这里插入图片描述

事件分类

在这里插入图片描述
1.事件的注册(绑定)
事件注册(绑定),当事件响应(触发)后要浏览器执行哪些操作代码,叫做事件注册或事件绑定;

2.静态注册事件
通过html标签的事件属性直接赋予事件响应后的代码,这种方式叫做静态注册;

3.动态注册事件(dom)
通过 js 代码得到标签的 dom 对象,然后再通过 dom 对象.事件名 = function () {} 这种形式叫做动态注册

4.动态注册事件步骤
(1)获取标签对象dom对象;
(2dom对象.事件名 = function() {}

onload加载完成事件

1.onload: 某个页面或图像被完成加载.

2.应用实例 创建 onload.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>加载完成事件</title><script type="text/javascript">//定义一个函数function hi() {console.log("静态注册 通过onload事件");}//1.在js中, 将页面窗口映射成window的dom对象//2.window对象有很多函数和属性, 以供程序员使用//3.window.onload 表示页面被加载完毕//4.后面的 function() {} 表示页面加载完毕后要执行的函数/代码window.onload = function () {console.log("动态注册 onload事件");};</script>
</head>
<!--静态注册-->
<!--<body οnlοad="hi()">-->
<body>
页面加载
</body>
</html>

onclick单击事件

1.onclick: 鼠标点击某个对象

2.应用实例 创建onclick.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>onclick 单击事件</title><script type="text/javascript">function hi() {console.log("点击了hi()按钮");}//当页面加载完毕后, 我们再进行动态绑定//基本概念和机制一定要清楚window.onload = function () {//动态注册 onclick事件//1.得到 id=btn01 的button标签对应的dom对象//2.通过dom对象动态地绑定onclick事件//3.通过document的getElementById()获取对应的dom对象var btn01 = document.getElementById("btn01");btn01.onclick = function () {console.log("点击了btn01按钮");}}</script>
</head>
<body>
<!--静态注册 onclick事件-->
<button onclick="hi()">hi()按钮-静态注册</button><br/>
<button id="btn01">hi()按钮-动态注册</button>
</body>
</html>

onblur失去焦点事件

1.onblur: 元素失去焦点

2.应用实例 创建onblur.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>onblur 失去焦点事件</title><script type="text/javascript">//动态注册(绑定)//onload 加载完成事件 window表示当前窗口的dom对象//表示当前窗口加载完成后window.onload = function () {var btn01 = document.getElementById("btn01");btn01.onblur = function () {this.value = this.value.toUpperCase()}}function hi() {var btn02 = document.getElementById("btn02");btn02.value = btn02.value.toUpperCase();}</script>
</head>
<body>
输入英文单词(动态注册):
<input type="text" id="btn01"/><br/>
输入英文单词(静态注册):
<input type="text" id="btn02" onblur="hi()">
</body>
</html>

onchange内容发生改变事件

1.onchange: 域的内容被改变

2.应用实例 创建onchange.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>内容发生改变事件</title><script type="text/javascript">function salLevel() {console.log("工资变化了");}window.onload = function () {var mySports = document.getElementById("mySports");mySports.onchange = function () {console.log("你喜欢的运动变了");}}</script>
</head>
<body>
你当前的工资水平(静态注册):
<select onchange="salLevel()"><option selected>--工资范围--</option><option>under 10k</option><option>10k to 30k</option><option>upper 30k</option>
</select><br/>
你当前擅长的运动(动态注册):
<select id="mySports"><option selected>--运动类型--</option><option>篮球</option><option>足球</option><option>乒乓球</option>
</select>
</body>
</html>

onsubmit表单提交事件

1.需求: 注册按钮被点击, 提交表单. 如果用户名或密码为空, 不能提交表单.

2.应用实例 创建onsubmit.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>onsubmit 表单提交事件</title><script type="text/javascript">function register() {var username = document.getElementById("username");var password = document.getElementById("password");if (username.value == "" || password.value == "") {alert("用户名或密码为空, 不能提交表单(静态注册).");return false;}}//等页面window加载完成, 调用function函数window.onload = function () {var registerForm = document.getElementById("registerForm");registerForm.onsubmit = function () {var address = document.getElementById("address");var email = document.getElementById("email");if (address.value == "" || email.value == "") {alert("地址或邮件为空, 不能提交表单(动态注册).");return false;}}}</script>
</head>
<body>
<h1>用户(静态)注册</h1>
<form action="onblur.html" onsubmit="return register()">username:<input type="text" name="username" id="username"/><br/><br/>password:<input type="password" name="password" id="password"/><br/><br/><input type="submit" value="静态注册">
</form>
<h1>用户(动态)注册</h1>
<form action="onblur.html" id="registerForm">address:<input type="text" name="address" id="address"/><br/><br/>email:<input type="text" name="email" id="email"/><br/><br/><input type="submit" value="动态注册">
</form>
</body>
</html>

表单作业

1.obsubmit: 注册按钮被点击, 提交表单, 要求如下

在这里插入图片描述

2.应用实例 创建 onsubmit-作业.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>表单作业</title><script type="text/javascript">window.onload = function () {var registerForm = document.getElementById("registerForm");registerForm.onsubmit = function () {var username = document.getElementById("username");var password = document.getElementById("password");var confirm = document.getElementById("confirm");var email = document.getElementById("email");var usernameReg = /^\w{4,6}$/;if (!usernameReg.test(username.value)) {alert("用户名长度不对, 请重新输入");return false;}var passwordReg = /^\w{6}$/;if (!passwordReg.test(password.value)) {alert("密码长度不对, 请重新输入");return false;}if (password.value != confirm.value) {alert("两次密码不一致, 请重新输入");return false;}var emailReg = /^\w+@\w+\.\w$/;if (!emailReg.test(email.value)) {alert("邮件格式不对, 请重新输入");return false;}}}</script>
</head>
<body>
<h1>用户(动态)注册</h1>
<form action="onblur.html" id="registerForm">用户名:<input type="text" name="username" id="username"/>长度(4-6)<br/>密码:<input type="password" name="password" id="password"/>长度(6)<br/>确认:<input type="password" name="confirm" id="confirm"/>长度(6)<br/>邮件:<input type="text" name="email" id="email"/>满足基本格式<br/><input type="submit" value="动态注册"/>
</form>
</body>
</html>

相关文章:

JavaWeb系列三: JavaScript学习 下

JavaScript学习 数组学习数组定义数组使用和遍历 js函数快速入门函数定义方式方式1: function关键字定义函数方式2: 将函数赋给变量 js函数注意事项和细节js函数练习 js自定义对象方式1: Object形式方式2: {}形式 事件基本介绍事件分类onload加载完成事件onclick单击事件onblur…...

web开发,过滤器,前后端交互

目录 web开发概述 web开发环境搭建 Servlet概述 Servlet的作用&#xff1a; Servlet创建和使用 Servlet生命周期 http请求 过滤器 过滤器的使用场景&#xff1a; 通过Filter接口来实现&#xff1a; 前后端项目之间的交互&#xff1a; 1、同步请求 2、异步请求 优化…...

CUDA-MODE 第一课课后实战(下)

我的课程笔记&#xff0c;欢迎关注&#xff1a;https://github.com/BBuf/how-to-optim-algorithm-in-cuda/tree/master/cuda-mode CUDA-MODE 第一课课后实战&#xff08;下&#xff09; Nsight Compute Profile结果分析 继续对Nsight Compute的Profile结果进行分析&#xff0…...

PostgreSQL数据库内核(三):缓冲区管理器

文章目录 共享缓冲区基础知识逻辑读和物理读LRU算法和CLOCK时钟算法 共享缓冲区管理器结构共享缓冲表层共享缓冲区描述符层共享缓冲页层 共享缓冲区管理器工作流程初始化缓冲区读缓冲区淘汰策略共享缓冲区锁 共享缓冲区基础知识 通常数据库系统都会在内存中预留buffer缓冲空间…...

[log4cplus]: 快速搭建分布式日志系统

关键词: 日志系统 、日志分类、自动分文件夹、按时间(月/周/日/小时/分)轮替 一、引言 这里我默认看此文的我的朋友们都已经具备一定的基础,所以,我们本篇不打算讲关于log4cplus的基础内容,文中如果涉及到没有吃透的点,需要朋友们动动自己聪明的脑袋和发财的手指,进一…...

redis I/O复用机制

I/O复用模型 传统阻塞I/O模型 串行化处理&#xff0c;就是要等&#xff0c;假如进行到accept操作&#xff0c;cpu需要等待客户端发送的数据到tcp接收缓冲区才能进行read操作&#xff0c;而在此期间cpu不能执行任何操作。 I/O复用 用一个进程监听大量连接&#xff0c;当某个连…...

Adobe PhotoShop - 制图操作

1. 排布照片 菜单 - 视图 - 对齐&#xff1a;打开后图层将会根据鼠标的移动智能对齐 菜单 - 视图 - 标尺&#xff1a;打开后在页面出现横纵标尺&#xff0c;方便图层的对齐与排列 2. 自动生成全景照 在日常处理中&#xff0c;我们常常想要将几张图片进行拼接获得一张全景图&…...

Mysql 中的Undo日志

在 MySQL 的 InnoDB 存储引擎中&#xff0c;Undo Log 是用于实现数据库事务的回滚功能的一种日志。Undo Log 记录了对数据的修改&#xff0c;以便在事务出现问题时可以恢复到之前的状态。下面将介绍 Undo Log 的结构和样本数据。 Undo Log 的基本概念 目的: Undo Log 的主要目…...

虹软科技25届校招笔试算法 A卷

目录 1. 第一题2. 第二题3. 论述题 ⏰ 时间&#xff1a;2024/08/18 &#x1f504; 输入输出&#xff1a;ACM格式 ⏳ 时长&#xff1a;2h 本试卷分为不定项选择&#xff0c;编程题&#xff0c;必做论述题和选做论述题&#xff0c;这里只展示编程题和必做论述题&#xff0c;一共三…...

C++ | Leetcode C++题解之第345题反转字符串中的元音字母

题目&#xff1a; 题解&#xff1a; class Solution { public:string reverseVowels(string s) {auto isVowel [vowels "aeiouAEIOU"s](char ch) {return vowels.find(ch) ! string::npos;};int n s.size();int i 0, j n - 1;while (i < j) {while (i < …...

Kubernetes拉取阿里云的私人镜像

前提条件 登录到阿里云控制台 拥有阿里云的ACR服务 创建一个命名空间 获取仓库的访问凭证&#xff08;可以设置固定密码&#xff09; 例如 sudo docker login --usernameyourAliyunAccount registry.cn-guangzhou.aliyuncs.com 在K8s集群中创建一个secret 使用kubectl命令行…...

Leetcode每日刷题之118.杨辉三角

1.题目解析 杨辉三角作为一个经典的数学模型&#xff0c;其基本原理相信大家已经耳熟能详&#xff0c;这里主要是在学习了vector之后&#xff0c;对于本题有了新的解法&#xff0c;更加简便。关于vector的基本使用详见 面向对象程序设计(C)之 vector&#xff08;初阶&#xff0…...

【ARM 芯片 安全与攻击 5.2 -- 芯片中侧信道攻击与防御方法介绍】

文章目录 什么是 Speculation Barriers?如何使用 Speculation Barriers?什么是 PAN?如何启用 PAN?使用 PAN 保护操作系统Spectre 攻击防御示例Meltdown 攻击防御示例Summary什么是 Speculation Barriers? Speculation Barriers,是一种防止处理器在投机执行中泄漏敏感信息…...

XSS-games

XSS 1.XSS 漏洞简介2.XSS的原理3.XSS的攻击方式4.XSS-GAMESMa SpaghetJefffUgandan KnucklesRicardo MilosAh Thats HawtLigmaMafiaOk, BoomerWW3svg 1.XSS 漏洞简介 ​ XSS又叫CSS&#xff08;Cross Site Script&#xff09;跨站脚本攻击是指恶意攻击者往Web页面里插入恶意Sc…...

日撸Java三百行(day25:栈实现二叉树深度遍历之中序遍历)

目录 一、栈实现二叉树遍历的可行性 二、由递归推出栈如何实现中序遍历 1.左子树入栈 2.根结点出栈 3.右子树入栈 4.实例说明 三、代码实现 总结 一、栈实现二叉树遍历的可行性 在日撸Java三百行&#xff08;day16&#xff1a;递归&#xff09;中&#xff0c;我们讲过…...

【vue讲解:ref属性、动态组件、插槽、vue-cli创建项目、vue项目目录介绍、vue项目开发规范、es6导入导出语法】

0 ref属性&#xff08;组件间通信&#xff09; # 1 ref属性放在普通标签上<input type"text" v-model"name" ref"myinput">通过 this.$refs[myinput] 拿到的是 原生dom对象操作dom对象&#xff1a;改值&#xff0c;换属性。。。# 2 ref属…...

ubuntu:最新安装使用docker

前言 系统&#xff1a;ubuntu 22.04 desktop 目的&#xff1a;安装使用docker 安装小猫猫 没有安装包的&#xff0c;可以自己去瞅瞅&#xff0c;这里不提供下载方式 sudo dpkg -i ./cat-verge_1.7.5_amd64.deb 在应用里&#xff0c;打开这个软件&#xff0c;并开启系统猫猫 配…...

Linux ssh 免密失效

sudo chmod -R 777 /home/xxx sudo chown -R xxx:xxx /home/xxx 为什么我输入这两条指令后&#xff0c;ssh免密失效了&#xff1f; 当你使用 sudo chmod -R 777 /home/xxx 和 sudo chown -R xxx:xxx /home/xxx 这两条指令后&#xff0c;可能会导致 SSH 免密登录失效的原因有以…...

k8s上部署ingress-controller

一、安装helm仓库 # helm pull ingress-nginx/ingress-nginx 二、修改 三、运行 # kubectl label nodes node01.110111.cn ingresstrue# kubectl label nodes node02.110112.cn ingresstrue# helm upgrade --install ingress-nginx -n ingress-nginx . -f values.yaml 四、检…...

Android 13 about launcher3 (1)

Android 13 Launcher3 android13#launcher3#分屏相关 Launcher3修改 wm density界面布局不改变 /packages/apps/Launcher3/src/com/android/launcher3/InvariantDeviceProfile.java Launcher的默认配置加载类&#xff0c;通过InvariantDeviceProfile方法可以看出&#xff0c;…...

服务器数据恢复—raid5阵列热备盘未全部启用导致阵列崩溃的数据恢复案例

服务器存储数据恢复环境&#xff1a; 一台EMC某型号存储中有一组RAID5磁盘阵列。该raid5阵列中有12块硬盘&#xff0c;其中2块硬盘为热备盘。 服务器存储故障&#xff1a; 该存储raid5阵列中有两块硬盘离线&#xff0c;只有1块热备盘启用替换掉其中一块离线盘&#xff0c;另外…...

HTML—css

css概述 C S S 是 C a s c a d i n g S t y l e S h e e t s &#xff08; 级 联 样 式 表 &#xff09; 。 C S S 是 一 种 样 式 表 语 言 &#xff0c; 用 于 为 H T M L 文 档 控 制 外 观 &#xff0c; 定 义 布 局 。 例 如 &#xff0c; C S S 涉 及 字 体 、 颜 色 、…...

IO多路复用(Input/Output Multiplexing)

IO多路复用(Input/Output Multiplexing) 是一种在单个线程中管理多个输入/输出通道的技术。它允许一个线程同时监听多个输入流(如网络套接字、文件描述符等),并在有数据可读或可写时进行相应的处理,而不需要为每个通道创建一个独立的线程。这种技术主要用于处理并发连接…...

android与pc 用socket无线通信

今天做一个android与pc通信的小demo&#xff08;不是wifi&#xff0c;蓝牙&#xff09;android为客户端&#xff0c;pc为服务器&#xff08;一对多&#xff09;。pc代码很简单&#xff0c;android客户端代码也不难&#xff0c;但是有一点不太明白就是在客户端向服务器发送消息时…...

【流程引擎】springboot完美集成activiti工作流方案

前言 activiti工作流引擎项目&#xff0c;企业erp、oa、hr、crm等企事业办公系统轻松落地&#xff0c;一套完整并且实际运用在多套项目中的案例&#xff0c;满足日常业务流程审批需求。 项目源码配套文档获取&#xff1a;本文末个人名片直接获取。 一、项目形式 springboot…...

11、常见API

01、String类概述及构造方法简介 一、字符串 由多个字符组成的一串数据 二、简介 String类代表的是一个字符串。字符串对象在开发中是最常见的。为了方便我们对字符串进行操作&#xff0c;java就把字符串用对象进行了封装&#xff0c;这个封装就是String类 三、String类的构造方…...

渗透第三次作业

目录 第一关Ma Spaghet! 第二关Jefff&#xff1a; 第三关&#xff1a;Ugandan Knuckles 第四关&#xff1a;Ricardo Milos 第五关&#xff1a; Ah Thats Hawt 第一关Ma Spaghet! <h2 id"spaghet"></h2> <script>spaghet.innerHTML (new URL(…...

Python自动化:解锁高效工作与生产力的密钥

在当今快节奏的数字时代&#xff0c;自动化已成为提升工作效率、优化流程、减少人为错误的不可或缺的工具。Python&#xff0c;作为一种功能强大、易于学习且应用广泛的编程语言&#xff0c;在自动化领域扮演着举足轻重的角色。无论是数据处理、Web自动化、软件测试&#xff0c…...

Sentinel1.8.1 控制台改造

Sentinel 控制台是流量控制、熔断降级规则统一配置和管理的入口&#xff0c;它为用户提供了机器自发现、簇点链路自发现、监控、规则配置等功能。在 Sentinel 控制台上&#xff0c;我们可以配置规则并实时查看流量控制效果。 本项目是在Sentinel控制台1.8.1的基础上改造的&…...

设计模式(2)行为型模式和七大原则

1、目标 本文的主要目标是学习设计模式的行为型模式并举例说明 2、行为型模式 2.1 观察者模式&#xff08;Observer&#xff09; 观察者模式是对象之间存在一对多的依赖关系&#xff0c;当一个对象的状态发生变化时&#xff0c;所有依赖它的对象都会得到通知并自动更新&…...

学懂C++(三十一):高级教程——深入详解C++高级多线程编程技术之锁优化与替代

引言 随着多核处理器的普及&#xff0c;多线程编程技术已经成为提高应用程序性能的关键手段。在多线程环境下&#xff0c;如何高效、安全地管理线程之间的共享资源是开发者面临的主要挑战。传统的锁机制&#xff0c;如互斥锁&#xff08;Mutex&#xff09;、临界区&#xff08;…...

Linux - 基础工具使用

文章目录 一、yum1、介绍2、功能3、语法4、使用 二、rzsz1、安装rzsz的指令2、介绍3、使用 三、vim基础使用1、介绍2、基础使用 四、gcc/g使用1、生成可执行文件过程2、语法3、常用选项4、编译过程5、动静态库6、包含头文件的多文件编译7、链接外部库 一、yum 1、介绍 Linux中…...

理解线程id和简单封装原生线程库

一、理解线程id 首先我们要知道给用户提供的线程id不是内核里面LWP&#xff08;轻量级进程id&#xff09;&#xff0c;而是pthread库自己维护的一个唯一值。 我们理解为什么线程id不是内核里面LWP&#xff0c;因为用户没有权限使用内核里面的字段&#xff0c;那是专门给OS管理…...

Unified 阻抗控制 architecture、framework、approach

Unified 阻抗控制&#xff08;Unified Impedance Control&#xff09;作为一种控制策略&#xff0c;其architecture&#xff08;架构&#xff09;、framework&#xff08;框架&#xff09;和approach&#xff08;方法&#xff09;为&#xff1a; 一、Unified 阻抗控制 Archite…...

Java后端面试题(mq相关)(day9)

目录 为什么用MQ&#xff1f; 异步 、削峰、解耦1. 异步处理2. 解耦3. 削峰填谷 Exchange类型什么是死信队列&#xff1f;如何保证消息的可靠性&#xff1f;RabbitMQ中如何解决消息堆积问题?RabbitMQ中如何保证消息有序性?如何防止消息重复消费&#xff1f;(如何保证消息幂等…...

算法-华为OD机试-识别有效的IP地址和掩码并进行分类统计

1.描述 见牛客网 https://www.nowcoder.com/practice/de538edd6f7e4bc3a5689723a74356822. 分析 根据题目要求&#xff0c;分为以下几步 1. 提取IP地址和子网掩码 我们首先需要拆分输入的每一行&#xff0c;分别提取IP地址和子网掩码&#xff0c;并检查它们的合法性。 2.…...

钉钉开发网页应用JSAPI前端授权鉴权nodejs实现

钉钉开发网页应用JSAPI前端授权鉴权nodejs实现 使用钉钉进行H5网页开发的时候&#xff0c;需要调用一些钉钉提供具有原生能力的api&#xff0c;要调用这些api需要进行jsapi授权。 详见官方文档&#xff08;可选&#xff09;开发网页应用前端 - 钉钉开放平台 (dingtalk.com) 官方…...

uniapp 自定义全局弹窗

自定义全局弹窗可在js和.vue文件中调用&#xff0c;unipop样式不满足&#xff0c;需自定义样式。 效果图 目录结构 index.vue <template><view class"uni-popup" v-if"isShow"><view class"uni-popup__mask uni-center ani uni-cust…...

element+-ui图片无法使用--安装

element-ui图片无法使用 安装npm install element-plus/icons-vue 注册 // main.jsimport * as ElementPlusIconsVue from element-plus/icons-vueconst app createApp(App) for (const [key, component] of Object.entries(ElementPlusIconsVue)) {app.component(key, compo…...

Python编码系列—Python ORM(对象关系映射):高效数据库编程实践

&#x1f31f;&#x1f31f; 欢迎来到我的技术小筑&#xff0c;一个专为技术探索者打造的交流空间。在这里&#xff0c;我们不仅分享代码的智慧&#xff0c;还探讨技术的深度与广度。无论您是资深开发者还是技术新手&#xff0c;这里都有一片属于您的天空。让我们在知识的海洋中…...

一次日志记录中使用fastjson涉及到ByteBuffer的教训

背景 目前本人在公司负责的模块中&#xff0c;有一个模块是负责数据同步的&#xff0c;主要是将我们数据产线使用的 AWS Dynamodb 同步的我们的测试QA 的环境的 MongoDB 的库中&#xff0c;去年开始也提供了使用 EMR 批量同步的功能&#xff0c;但是有时候业务也需要少量的数据…...

掌握TCP连接管理与流量控制:从零开始

文章目录 1. TCP连接管理1.1 三次握手&#xff08;Three-way Handshake&#xff09;1.2 四次挥手&#xff08;Four-way Handshake&#xff09;1.3 TCP连接管理的重要性 2. TCP流量控制2.1 滑动窗口&#xff08;Sliding Window&#xff09;2.2 拥塞控制&#xff08;Congestion C…...

python提取b站视频的音频(提供源码

如果我想开一家咖啡厅&#xff0c;那么咖啡厅的音乐可得精挑细选&#xff01;又假设我非常喜欢o叔&#xff0c;而o叔只在b站弹钢琴&#xff0c;那这时候我就得想方设法把b站的视频转为音频咯&#xff01; 一、首先打开网页版bilibili&#xff0c;按F12&#xff1a; 二、刷新页面…...

嵌入式Linux ,QT5 鼠标键盘设备参数指定环境变量的方法

根文件系统中&#xff0c;一般用mdev来管理设备&#xff0c;不像udev方便&#xff0c;有时候在执行rcS脚本的时候因为&#xff0c;太快&#xff0c;有些设备比如鼠标还没在/dev/input中生成设备文件&#xff0c;最好使用前用mdev -s扫描并等待几秒钟&#xff0c;然后就可以在in…...

C语言钥匙迷宫2.0

目录 开头程序程序的流程图程序游玩的效果结尾 开头 大家好&#xff0c;我叫这是我58。废话不多说&#xff0c;咱们直接开始。 程序 #define _CRT_SECURE_NO_WARNINGS 1 #include <stdio.h> #include <string.h> #include <Windows.h> enum color {Y,B,R …...

【多线程】初步认识Thread类及其应用

&#x1f490;个人主页&#xff1a;初晴~ &#x1f4da;相关专栏&#xff1a;多线程 / javaEE初阶 上篇文章我们简单介绍了什么是进程与线程&#xff0c;以及他们之间的区别与联系&#xff0c;实际应用中还是以多线程编程为主的&#xff0c;所以这篇文章就让我们更加深入地去剖…...

algorithm算法库学习之——划分操作和排序操作

algorithm此头文件是算法库的一部分。本篇介绍划分操作和排序操作。 划分操作 is_partitioned (C11) 判断范围是否已按给定的谓词划分 (函数模板) partition 将范围中的元素分为两组 (函数模板) partition_copy (C11) 复制一个范围&#xff0c;将各元素分为两组 (函数模板) st…...

XSS实验记录

目录 XXS地址 实验过程 Ma Spaghet Jeff Ugandan Knuckles Ricardo Milos Ah Thats Hawt Ligma Mafia Ok, Boomer XXS地址 XSS Game - Learning XSS Made Simple! | Created by PwnFunction 实验过程 Ma Spaghet 要求我们弹出一个alert(1337)sandbox.pwnfuncti…...

Cortex-A7的GIC(全局中断控制器)使用方法(7):基于stm32MP135的GIC配置中断效果测试

0 参考资料 STM32MP13xx参考手册.pdf&#xff08;RM0475&#xff09; ARM Generic Interrupt Controller Architecture version 2.0 - Architecture Specification.pdf 1 GIC配置中断效果测试 前面我们已经实现了GIC的配置&#xff0c;为了验证GIC是否配置有效&#xff0c;本例…...

c++动态数组new和delete

文章目录 动态数组的使用大全1. **基本创建和初始化**2. **动态调整大小**3. **动态数组的使用与标准库 std::vector**4. **动态数组作为函数参数**输出 5. **使用动态数组存储用户输入** 动态数组的使用大全 1. 基本创建和初始化 示例&#xff1a; #include <iostream&g…...