JavaScript基础入门（一）：从零开始掌握网页互动与动态效果
JS基础（一）
目的：html是骨架，css是血和肉，js 就是灵魂
知识点一：JavaScript基本使用
网页的三剑客分别是：HTML、CSS、JS，我们把HTML当做毛坯房，CSS是房子的装修，那现在我们房子买好了，房子的装修也搞好了，接下来置办家里的智能电器了，OK，接下来我们一起进入JS 的学习。JS一共有三节课，现在开始我们JS的第一节课。JS，我们主要是用于实现各种各样的事件。Javascript与Java是由不同的公司开发的不同产品。Javascript是Netscape公司的脚本语言；
而Java是SUN Microsystems 公司推出的新一代面向对象的程序设计语言。JavaScript 是动态类型语言；而 Java 是静态类型语言。JavaScript 是 HTML 中的默认脚本语言。1，JavaScript是什么？
JavaScript是一种可以和html标记语言混合使用的脚本语言，JavaScript 也是一种解释型语言编译型语言（有专门的编译器，因为编译型语言是一次性编译成机器语言的，所以可以脱离开发环境独立运行，而且通常运行效率较高。因此，它不需要编译。）2，可以干嘛？
JavaScript 以交互式和动态的方式呈现网页。这允许页面对事件做出反应，展示特殊效果。3，应该写在哪里？
JavaScript用于页面特效，前后交互，以及用node.js来进行后台开发。
JavaScript可以写在<script>标签里，也可以写在外部的js文件内。接下来我们来学习JS的两种写法。1、JS写在哪
1. 写在 script 标签里面
<body>
<script>alert(123);
</script>
</body># alert是JS内置弹窗函数2,写在外部的 js 文件内，然后引入新建一个js文件：（不需要添加script标签）
alert(456)<body>
<script src="xuyuan.js"></script>
</body>2、JS 修改元素内容
PPT方法一：
<body>
<p id="txt">这是段落</p>
<script>var txtDom = document.getElementById('txt');txtDom.innerText = '我是我';
</script>
</body>1. 首先获取id为xxx的元素，document.getElementById("xxx");
2. var 是 js 定义变量的关键字
3. innerHTML 和 innerText 可以修改/获取补充：innerHTML指的是从对象的起始位置到终止位置的全部内容,包括Html标签。
innerText指的是从起始位置到终止位置的内容,但它去除Html标签。
同时，innerHTML 是所有浏览器都支持的，innerText 是IE浏览器和chrome 浏览器支持的，Firefox浏览器不支持。其实，innerHTML 是W3C 组织规定的属性；而innerText 属性是IE浏览器自己的属性，不过后来的浏览器部分实现这个属性罢了。方法二：
<body>
<p id="p1">这是段落</p>
<button type="button" onclick="xuyuan()">点一下</button>
<script>function xuyuan() {document.getElementById("p1").innerHTML = "段落已被更改。";}
</script>
</body># onclick鼠标单击，function功能，document文件，getElementById取元素名字，innerHTML内容3、JS 获取元素
id
<body>
<p id="p1">这是段落</p>
<script>var ppt = document.getElementById('p1');ppt.innerText = '我是我';
</script>
</body>
## innerText修改文本内容第二种：给p标签加div，加一个var对象，
<body>
<div id="div1"><p id="p1">这是段落</p>
</div>
<script>var box = document.getElementById('div1')var ppt = document.getElementById('p1');
// ppt.innerText = '我是我';ppt.innerHTML = '我是他';console.log(box.innerText);// console.log(box.innerHTML);
</script>
</body>
### console.log在控制台进行打印
### box.innerText返回文本内容。。。box.innerHTML返回标签+文本内容class
<body>
<div id="div1"><p id="p1" class="p2">这是段落，举头望明月</p><p class="p2">这是第二段段落，疑是地上霜</p>
</div>
<script>var box = document.getElementById('div1')var p11 = document.getElementsByClassName("p2");p11[1].innerHTML = "我是小可爱"
</script>
</body>选择类不是唯一的，要加下标选择第几个tagName标签名：
<body>
<div id="div1"><p id="p1" class="p2">这是段落，举头望明月</p><p class="p2">这是第二段段落，疑是地上霜</p>
</div><script>var box = document.getElementById('div1')var p11 = document.getElementsByTagName("p");p11[0].innerHTML = "我是小可爱"
</script>
</body>选择标签不是唯一的，要加下标选择第几个name属性
<body>
<div id="div1"><p id="p1" class="p2" name="p3">这是段落，举头望明月</p><p class="p2">这是第二段段落，疑是地上霜</p>
</div><script>var box = document.getElementById('div1')var p11 = document.getElementsByName("p3");p11[0].innerHTML = "我是小可爱"
</script>
</body>加name属性，选择下标selector通过CSS选择器：<body>
<div id="div1"><p id="p1" class="p2" name="p3">这是段落，举头望明月</p><p class="p2">这是第二段段落，疑是地上霜</p>
</div><script>var box = document.getElementById('div1');var p11 = document.querySelector("#p1")p11.innerHTML = "我是小可爱"
</script>
</body>
## 去掉下标，找#选择器通过class：改class名字，只能获取一个，找下标也不行：
<body>
<div id="div1"><p id="p1" class="p2" name="p3">这是段落，举头望明月</p><p class="p33">这是第二段段落，疑是地上霜</p><p class="p33">这是第二段段落，疑是地上霜</p>
</div><script>var box = document.getElementById('div1');var p11 = document.querySelector(".p33")p11.innerHTML = "我是小可爱"
</script>
</body>通过css获取所有：改下标，加下标，只能一次作用一个：
<body>
<div id="div1"><p id="p1" class="p2" name="p3">这是段落，举头望明月</p><p class="p2">这是第二段段落，疑是地上霜</p><p class="p2">这是第二段段落，窗前明月光</p>
</div><script>var box = document.getElementById('div1');var p11 = document.querySelectorAll(".p2")p11[2].innerHTML = "我是小可爱"
</script>
</body>JS获取元素支持复杂的CSS选择器，但是不能用伪类选择器，伪元素
知识点二：JavaScript 简单事件
1、点击事件
<body>
<div onclick="xu();">点击事件</div>
<script>function xu() {console.log("点击事件");}
</script>
</body>
# onclick鼠标单击， "xu();"函数名， function功能， console控制台， log日志
# 运行后，打开网页，检查，点开Console控制台，然后点击：点击事件
# 不常用<body>
<div>点击事件</div>
<script>var box = document.querySelector('div');box.onclick = function () {console.log("单击");}
</script>
</body>
# 运行后，打开网页，检查，点开Console控制台，然后点击：点击事件
# var 语句用于声明变量。，box变量，document文档，querySelector选择器，onclick鼠标单击，function功能
# querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。<body>
<div>点击事件</div>
<script>var box = document.querySelector('div');box.onclick = function () {console.log("单击");}box.ondblclick = function () {console.log("双击");}
</script>
</body>
# 运行后，打开网页，检查，点开Console控制台，然后点击：点击事件
# 复制单击事件，然后改onclick单击为ondblclick双击即可案例：单击
<head><script>function xu(){document.getElementById("p1").innerHTML="单击事件";}</script>
</head>
<body>
<button onclick="xu()">单击</button>
<p id="p1"></p>
</body>
定义和用法
onclick 事件会在元素被点击时发生。案例：双击
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title></head><body><button ondblclick="onclick_test()">双击</button><p id="p1"></p></body><script type="text/javascript">function onclick_test() {document.getElementById('p1').innerHTML = '双击事件';}</script>
</html>
ondblclick 事件会在对象被双击时发生。2、鼠标事件
在head里面添加div盒子样式，方便观察：<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title><style type="text/css">div {width: 100px;height: 100px;background: #2196F3;}</style></head><body><div id="p1"></div></body><script type="text/javascript">var box = document.getElementById('p1');// 鼠标划入事件box.onmouseover = function () {box.style.backgroundColor = 'pink';}// 鼠标移出事件box.onmouseout = function () {box.style.backgroundColor = 'blue';}</script>
</html>'''
mouseenter：当鼠标移入某元素时触发。：当鼠标移出某元素时触发。mouseover：当鼠标移入某元素时触发，移入和移出其子元素时也会触发。mouseout：当鼠标移出某元素时触发，移入和移出其子元素时也会触发。mousemove：鼠标在某元素上移动时触发，即使在其子元素上也会触发。
'''3、窗口变化
在script中添加事件即可，监控窗口的变化：<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title></head><body></body><script type="text/javascript">window.onresize = function () {console.log('窗口发生改变了');}</script>
</html>4、改变下拉框
先在body里面添加一个下拉框：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title></head><body><select><option>北京</option><option>上海</option><option>广州</option><option>深圳</option></select></body><script type="text/javascript">var sel = document.querySelector('select');sel.onchange = function() {console.log('下拉框内容改变了')}</script>
</html># 运行后，打开网页，检查，点开Console控制台，然后选择下拉框，更换下拉框内容后会响应事件，不更换没有响应。
# var 语句用于声明变量。，sel变量，document文档，querySelector选择器，function功能
# querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。
# onchange 事件会在域的内容改变时发生。知识点三：JavaScript 修改样式
单个样式修改：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title></head><body><div class="box">图灵课堂</div></body><script type="text/javascript">var obj = document.querySelector('.box');obj.style.color = 'red';</script>
</html>多个样式修改:(接着添加)
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title></head><body><div class="box">图灵课堂</div></body><script type="text/javascript">var obj = document.querySelector('.box');obj.style.cssText = "width:200px;height:200px;background:skyblue";</script>
</html>
# cssText的本质就是设置 HTML 元素的 style 属性值。
# cssText的返回值：在某些浏览器中（比如 Chrome），你给他赋什么值，它就返回什么值。在 IE 中则比较痛苦，它会格式化输出、会把属性大写、会改变属性顺序、会去掉最后一个分号。1、标签属性
先建立模型框架：<style>.box{width: 100px;height: 100px;background: deepskyblue;}.text{width: 400px;height: 400px;background: red;}</style>
<body><div class="box">属性操作</div><script>// 获取元素var box = document.querySelector(".box")// JS操作标签属性(增删改查)// 增// 删// 改// 查</script>
</body>
### style建立两个样式备用。下方准备操作增删改查然后操作增删改查：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title><style>.box{width: 100px;height: 100px;background: deepskyblue;}.text{dth: 400px;height: 400px;background: red;}</style></head><body><div class="box">属性操作</div></body><script>// 获取元素var box = document.querySelector(".box")// JS操作标签属性(增删改查)// 增box.className = "box"// 删box.removeAttribute('class');// 改box.className = "text";// 查console.log(box.className)</script>
</html>接下来是属性的增删改查操作：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title><style>.box{width: 100px;height: 100px;background: deepskyblue;}.text{dth: 400px;height: 400px;background: red;}</style></head><body><div class="box">属性操作</div></body><script>// 获取元素var box = document.querySelector(".box")// JS操作标签属性(增删改查)// 增box.setAttribute('hh', 'ww')// 删box.removeAttribute("hh");// 改box.setAttribute('hh','tt');// 查console.log(box.hasAttribute('hh'));</script>
</html>知识点四：JavaScript 数据类型
我们学习的分类，JS有六大数据类型：
1，Number类型: 整数和小数NaN属性： not a number（属于数字类型，但不是数字）isNaN(): 用来检查参数是否是非数字值 2，string类型： 字符串length属性： 查看长度3，Boolean类型: 布尔true和false 小写真假4，Undefined类型只有一个值：undefined，变量声明但未初始化，这个变量的值就是undefined5，Null类型js里null属于对象类型的，但是它不具有对象的共性，所以，单独归为一类。6，object类型js中对象类型是一组集合。JavaScript 数字：
<body>
<script>
var x = 3.14;
var y = 314;
var z1=123e4;
var z2=123e-4;
document.write(x + "<br>")
document.write(x + y + "<br>")
document.write(z1 + "<br>")
document.write(z2 + "<br>")
</script>
<!--z=123e5极大或极小的数字可以通过科学（指数）计数法来书写：-->
</body>JavaScript 字符串：
<body><script>var a="窗前明月光，";var b='疑是地上霜。';var c='举头望\"明月\"，';var d='低头思"故乡"。';document.write(a + "<br>" + b + "<br>")document.write(c + "<br>")document.write(d + "<br>")</script>
</body>JavaScript 布尔：
布尔（逻辑）只能有两个值：true 或 false。<script>var x=true;var y=false;document.write(x + "<br>")document.write(y + "<br>")
</script>案例：
<script>var x = 3.14;var y = 314;document.write(x == y + "<br>")
</script>JavaScript 数组：
数组下标是基于零的，所以第一个项目是 [0]，第二个是 [1]，以此类推。<body><script>var i;var j = new Array();j[0] = "北京";j[1] = "上海";j[2] = "广州";for (i=0;i<j.length;i++) {document.write(j[i] + "<br>");}</script>
</body>或者，缩减一下写法：
<body>
<script>
var i;
var j=new Array("北京","上海","广州");
for (i=0;i<j.length;i++) {
document.write(j[i] + "<br>");
}
</script>
</body>又或者直接赋值：
<body>
<script>
var i;
var j=["北京","上海","广州"];
for (i=0;i<j.length;i++) {
document.write(j[i] + "<br>");
}
</script>
</body>JavaScript 对象：对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：<!--JavaScript 对象-->
<script>
var tt = {name : "栩源",age : 18,sex : '男'
};
document.write(tt.age + "<br>");
document.write(tt["name"] + "<br>");
</script>
</body>对象属性有两种寻址方式：
第一种：document.write(tt.age + "<br>");直接对象名字点数组中的键位，找值
第二种：document.write(tt["name"] + "<br>");直接对象名字点，中括号找下标，键位Undefined 和 NullUndefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。<body>
<script>
var i;
var j="栩源";
document.write(i + "<br>");
document.write(j + "<br>");
var j=null
document.write(j + "<br>");
</script>
</body>Object 构造函数创建一个对象包装器。
<body><script>var a = {name:'栩源',age:18};var b = [1,2,3];console.log(typeof a);console.log(typeof b);</script>
</body># typeof，查看数据类型
# 从网页检查，查看控制台作业
1，先建立框架
<body><p>样 式：<input></p><p>样式值：<input></p><p><input type="button" value="设置"></p><div>我就是我</div>
</body>补充完整：
<body><label><p>样 式：<input type="text" id="attr" placeholder="请输入CSS样式"></p></label><label><p>样式值：<input type="text" id="attv" placeholder="请输入CSS样式值"></p></label><p><input type="button" value="设置" class="btn"></p><div>我就是我</div>
</body>2，添加样式
<style>.btn{width: 80px;background: #2196F3;color: white;font-family: 宋体;font-size: 16px;border-radius: 6px;border: 0px solid;}div{width: 200px;height: 200px;background: #2196F3;/*//居中*/text-align: center;/*设置高：*/line-height: 200px;font-family: 华文楷体;font-size: 20px;}</style>3，添加功能
<script>var obj = document.querySelector("div");// 设置鼠标进入样式obj.onmouseenter = function () {obj.innerText = "我是萌男";obj.style.backgroundColor = 'pink';}// 设置鼠标移出样式obj.onmouseleave = function () {obj.innerText = "我是谁";obj.style.backgroundColor = 'red';}</script>4，实现按钮的点击事件
//实现点击按钮修改div样式事件var input = document.querySelectorAll("input");input[2].onclick = function () {//测试绑定成功了吗？去网页控制台查看okconsole.log("ok")var attr = input[0].value;var attv = input[1].value;obj.style[attr] = attv;}测试：
background(颜色)：orange yellow pink blue skyblue white black
color（字体）： orange yellow pink blue skyblue deepskyblue white相关文章：
JavaScript基础入门（一）：从零开始掌握网页互动与动态效果
JS基础（一） 目的：html是骨架，css是血和肉，js 就是灵魂 知识点一：JavaScript基本使用 网页的三剑客分别是：HTML、CSS、JS，我们把HTML当做毛坯房，CSS是房子的装修&#…...
20240824 美团 笔试
文章目录 1、单选题1.11.21.31.41.51.61.71.81.91.101.111.121.131.141.151.161.171.181.191.202、编程题2.12.2岗位：硬件开发工程师（嵌入式系统软件开发方向） 题型：20 道单选题，2 道编程题题 1、单选题 1.1 C 语言中，如果输入整数 v 是 2 的幂，下面表达式中哪个会返…...
css-根据不同后端返回值返回渲染不同的div样式以及公共组件设定
1.动态绑定 Vue: 使用计算属性 getClassName 来动态计算样式类名，并通过 :class 绑定到 div 元素上。 <template><div :class"getClassName">这是一个根据后端值动态设置样式的 div 元素。</div> </template><script> exp…...
【数据科学】一个强大的金融数据接口库：AKShare
文章目录 1. AKShare 简介2. 安装 AKShare3. AKShare 核心功能3.1 获取股票数据3.2 获取股票实时数据3.3 获取基金数据3.4 获取期货数据3.5 获取外汇数据3.6 获取数字货币数据 4. 数据处理与存储5. 实战案例6. 总结 AKShare 是一个开源的金融数据接口库，它提供了简单…...
Ubuntu 22.04系统安装部署Kubernetes v1.29.13集群
Ubuntu 22.04系统安装部署Kubernetes v1.29.13集群 简介Kubernetes 的工作流程概述Kubernetes v1.29.13 版本Ubuntu 22.04 系统安装部署 Kubernetes v1.29.13 集群 1 环境准备1.1 集群IP规划1.2 初始化步骤（各个节点都需执行）1.2.1 主机名与IP地址解析1.…...
如何开发一个大语言模型，开发流程及需要的专业知识
开发大型语言模型（LLM）是一个复杂且资源密集的过程，涉及多个阶段和跨学科知识。以下是详细的开发流程和所需专业知识指南： 一、开发流程 1. 需求分析与规划 目标定义：明确模型用途（如对话、翻译、代码生成…...
10. 神经网络（二.多层神经网络模型）
多层神经网络（Multi-Layer Neural Network），也称为深度神经网络（Deep Neural Network, DNN），是机器学习中一种重要的模型，能够通过多层次的非线性变换解决复杂的分类、回归和模式识别问题。以下…...
Windows 中学习Docker环境准备3、在Ubuntu中安装Docker
Windows 中学习Docker环境准备1、Win11安装Docker Desktop Windows 中学习Docker环境准备2、Docker Desktop中安装ubuntu Windows 中学习Docker环境准备3、在Ubuntu中安装Docker 需要更多Docker学习视频和资料，请文末联系 步骤 1：更新系统并安装依赖…...
Java项目: 基于SpringBoot+mybatis+maven+mysql实现的智能学习平台管理系(含源码+数据库+毕业论文)
一、项目简介 本项目是一套基于SpringBootmybatismavenmysql实现的智能学习平台管理系统 包含：项目源码、数据库脚本等，该项目附带全部源码可作为毕设使用。 项目都经过严格调试，eclipse或者idea 确保可以运行！ 该系统功能完善、…...
把bootstrap5.3.3整合到wordpress主题中的方法
以下是将 Bootstrap 5.3.3 整合到 WordPress 主题中的方法： 下载 Bootstrap 文件：从 Bootstrap 官网下载最新的 5.3.3 版本的 CSS 和 JavaScript 文件。 上传文件到主题目录：将下载的 CSS 文件上传到 WordPress 主题文件夹中的 /css 文件夹…...
【Gitlab】虚拟机硬盘文件丢失，通过xx-flat.vmdk恢复方法
前言 由于近期过年回家，为了用电安全直接手动关闭了所有的电源，导致年后回来商上电开机后exsi上的虚拟机出现了问题。显示我的gitlab虚拟机异常。 恢复 开机之后虚拟机异常，通过磁盘浏览发现gitlab服务器下面的虚拟机磁盘文件只有一个xxx-f…...
GC日志的解读
GC日志的解读 gc日志的解读 gc日志的解读...
Shell基础：中括号的使用
在Shell脚本中，中括号（[ ... ] 和 [[ ... ]]）是一种常见的条件测试结构。它们用于进行文件类型检查、值比较以及逻辑判断。通过了解它们的不同特点和用法，能够帮助你编写更加高效、安全且易读的脚本。本文将详细介绍Shell中单中括…...
结构体排序 C++ 蓝桥杯
成绩排序 #include<iostream> #include<algorithm> using namespace std; struct stu {string name;//名字int grade;//成绩 }; stu a[30]; bool cmp(stu l, stu r) {if (l.grade ! r.grade) return l.grade > r.grade;return l.name < r.name; } int main()…...
Windows本地部署DeepSeek-R1大模型并使用web界面远程交互
文章目录 前言1. 安装Ollama2. 安装DeepSeek-r1模型3. 安装图形化界面3.1 Windows系统安装Docker3.2 Docker部署Open WebUI3.3 添加Deepseek模型 4. 安装内网穿透工具5. 配置固定公网地址 前言 最近爆火的国产AI大模型Deepseek详细大家都不陌生，不过除了在手机上安…...
【分布式理论六】分布式调用（4）：服务间的远程调用（RPC）
文章目录 一、RPC 调用过程二、RPC 动态代理：屏蔽远程通讯细节1. 动态代理示例2. 如何将动态代理应用于 RPC 三、RPC 序列化四、RPC 协议编码1. 协议编码的作用2. RPC 协议消息组成 五、RPC 网络传输1. 网络传输流程2. 关键优化点 一、RPC 调用过程 RPC（…...
机器学习-线性回归（参数估计之结构风险最小化）
前面我们已经了解过关于机器学习中的结构风险最小化准则，包括L1 正则化（Lasso）、L2 正则化（Ridge）、Elastic Net，现在我们结合线性回归的场景，来了解一下线性回归的结构风险最小化，通…...
IM 即时通讯系统-46-OpenIM 提供了专为开发者设计的开源即时通讯解决方案
IM 开源系列 IM 即时通讯系统-41-开源 野火IM 专注于即时通讯实时音视频技术，提供优质可控的IMRTC能力 IM 即时通讯系统-42-基于netty实现的IM服务端,提供客户端jar包,可集成自己的登录系统 IM 即时通讯系统-43-简单的仿QQ聊天安卓APP IM 即时通讯系统-44-仿QQ即…...
WordPress自定义.js文件排序实现方法
在WordPress中，要将插件引用的.js文件放到所有.js文件之后加载，可以通过以下方法实现： 方法一：调整wp_enqueue_script的加载顺序 在插件的主文件中，使用wp_enqueue_script函数加载.js文件时，将$in_footer…...
node.js使用mysql2对接数据库
一、引言 在现代Web开发中，Node.js作为一种高效、轻量级的JavaScript运行时环境，已经广泛应用于后端服务的开发中。而MySQL，作为一个广泛使用的关系型数据库管理系统（RDBMS），提供了强大的数据存储和查询功能…...
SQL/Panda映射关系
Pandas教程（非常详细）_pandas 教程-CSDN博客 SQL：使用SELECT col_1, col_2 FROM tab; Pandas：使用df[[col_1, col_2]]。 SQL：使用SELECT * FROM tab WHERE col_1 11 AND col_2 > 5; Pandas：使用df…...
windows同时安装两个不同版本的Mysql
文章目录 目录 ?文章目录 前言 一、MySql下载 1、 官网下载： 2、 解压文件 3、 新建my.ini文件。 二、配置MySql环境变量 1、新建系统环境变量 ?三、MySql安装 1、进入MySql的bin目录 ?2、安装MySql服务 3、修改登录密码、并自动创建data文件夹 4、…...
Docker最佳实践：安装Nacos
文章目录 Docker最佳实践：安装Nacos一、引言二、安装 Nacos1、拉取 Nacos Docker 镜像2、启动 Nacos 容器 三、配置 Nacos（可选）四、使用示例1、服务注册2、服务发现 五、总结 Docker最佳实践：安装Nacos 一、引言 Nacos 是阿里巴…...
如何使用deepseek开发一个翻译API
什么是deepseek Deepseek 是一个基于人工智能技术的自然语言处理平台，提供了多种语言处理能力，包括文本翻译、语义分析、情感分析等。它通过深度学习模型和大规模语料库训练，能够实现高质量的文本翻译和多语言理解。Deepseek 的核心优势在于…...
【deepseek实战】绿色好用，不断网
前言 最佳deepseek火热网络，我也开发一款windows的电脑端，接入了deepseek，基本是复刻了网页端，还加入一些特色功能。 助力国内AI，发出自己的热量 说一下开发过程和内容的使用吧。 目录 一、介绍 二、具体工作 1.1、引…...
【基于SprintBoot+Mybatis+Mysql】电脑商城项目之修改密码和个人资料
🧸安清h：个人主页 🎥个人专栏：【Spring篇】【计算机网络】【Mybatis篇】 🚦作者简介：一个有趣爱睡觉的intp，期待和更多人分享自己所学知识的真诚大学生。 目录 🎃1.修改密码 -持久…...
3.攻防世界 weak_auth
题目描述提示 是一个登录界面，需要密码登录 进入题目页面如下 弱口令密码爆破 用1 or 1 #试试 提示用admin登录 则尝试 用户名admin密码：123456 直接得到flag 常用弱口令密码（可复制） 用户名 admin admin-- admin or -- admin…...
完全指南：用类型安全表达多样性)
Rust枚举(Enum)完全指南：用类型安全表达多样性
枚举（Enum）是Rust类型系统的核心特性之一，它不仅能够表示简单的选项集合，还能携带复杂数据，配合模式匹配实现强大的逻辑控制。本文将通过具体示例，深入解析Rust枚举的完整用法。 一、基础枚举定义 1.1 简单…...
『Apisix进阶篇』结合Consul作服务发现实战演练
文章目录 一、引言二、APISIX与Consul集成2.1 环境准备2.2 配置Consul服务发现2.2.1 修改APISIX配置文件2.2.2 重启APISIX 2.3 在路由中使用Consul服务发现2.3.1 创建路由2.3.2 验证路由 2.4 高级配置2.4.1 服务过滤2.4.2 多数据中心支持 三、总结 📣读完这篇文章里…...
家用报警器的UML 设计及其在C++和VxWorks 上的实现01
M.W.Richardson 著，liuweiw 译 论文描述了如何运用 UML（统一建模语言）设计一个简单的家用报警器，并实现到 VxWorks 操作系统上。本文分两个部分，第一部分描述了如何用 UML 设计和验证家用报警器的模型，以使…...