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

javaScript操作dom的事件（3个案例+代码+效果图）

news 2026/3/28 8:02:54

目录

1.焦点事件

案例:登录表单的验证

1.代码

2.效果

3.解释

2.鼠标事件

案例:单击鼠标使小球跳跃

1.代码

2.效果

3.解释

3.键盘事件

案例:使用左右键控制小球左右移动

1.代码

2.效果

 ​编辑

3.解释

1.焦点事件

  • focus   当获得焦点时出发(不会冒泡)
  • blur  当失去焦点时出发(不会冒泡)

案例:登录表单的验证

1.代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>登录表单的验证</title><style>body {font-family: Arial, sans-serif;background-color: #f0f0f0;margin: 0;padding: 20px;display: flex;justify-content: center;align-items: center;height: 100vh;}.myLoginStyle {background-color: #fff;border: 1px solid #ccc;border-radius: 5px;padding: 20px;width: 300px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);}.myNameDivStyle,.myPassowordStyle {margin-bottom: 10px;display: flex;align-items: center;}.myNameDivStyle label,.myPassowordStyle label {width: 60px;text-align: right;margin-right: 10px;}.myNameInputStyle,.myPasswordInputStyle {width: calc(100% - 70px); /* 减去标签宽度 */padding: 10px;border: 1px solid #ccc;border-radius: 5px;font-size: 16px;}.myNameInputStyle:focus,.myPasswordInputStyle:focus {outline: none;border-color: #007bff;box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);}button {background-color: #007bff;color: white;border: none;padding: 10px 20px;font-size: 16px;cursor: pointer;border-radius: 5px;margin-top: 10px;transition: background-color 0.3s ease;width: 100%;}button:hover {background-color: #0056b3;}</style>
</head>
<body><div class="myLoginStyle"><div class="myNameDivStyle"><label for="username">用户：</label><input type="text" id="username" placeholder="请输入用户名" class="myNameInputStyle"></div><div class="myPassowordStyle"><label for="password">密码：</label><input type="password" id="password" placeholder="请输入密码" class="myPasswordInputStyle"></div><button id="submitButtonStyle">登录</button></div><!-- 表单验证 --><script>//获取用户输入框var myNameInput = document.querySelector(".myNameInputStyle");//获取密码框var myPasswordInput = document.querySelector(".myPasswordInputStyle");//获取登录按钮var submitButton = document.querySelector("#submitButtonStyle");//用户输入框获得焦距修改样式myNameInput.onfocus = function () {//文字样式修改myNameInput.style.borderColor = "#007bff";myNameInput.style.boxShadow = "0 0 5px rgba(0, 123, 255, 0.5)";myNameInput.style.fontSize = "16px"; // 修复字体大小}myPasswordInput.onfocus = function () {//文字样式修改myPasswordInput.style.borderColor = "#007bff";myPasswordInput.style.boxShadow = "0 0 5px rgba(0, 123, 255, 0.5)";myPasswordInput.style.fontSize = "16px"; // 修复字体大小}//输入框失去焦距修改样式myNameInput.onblur = function () {//文字样式修改myNameInput.style.borderColor = "#ccc";myNameInput.style.boxShadow = "none";myNameInput.style.fontSize = "16px"; // 修复字体大小if (myNameInput.value === "") {alert("用户名不能为空");}}myPasswordInput.onblur = function () {//文字样式修改myPasswordInput.style.borderColor = "#ccc";myPasswordInput.style.boxShadow = "none";myPasswordInput.style.fontSize = "16px"; // 修复字体大小if (myPasswordInput.value === "") {alert("密码不能为空");}}// 登录按钮的判断submitButton.onclick = function () {// 获取用户输入的用户名和密码var username = myNameInput.value;var password = myPasswordInput.value;// 判断用户名和密码是否为空if (username === "" || password === "") {alert("用户名或密码不能为空");return;}alert("登录成功！"+ "\n用户名：" + username+ "\n密码：" + password);}</script>
</body>
</html>

2.效果

初始界面

用户名验证

密码框验证

注:这里只是简单的使用了一下非空判断，如果要进行复杂的判断可以使用正则表达式去判断

登录验证

密码验证不去实验了有兴趣可以自己去测试

登录成功验证

3.解释

HTML结构

  • 页面有一个标题“登录表单的验证”。
  • 页面中心有一个登录框，它包含两个输入字段：一个是用户名，另一个是密码。
  • 用户名和密码输入框都有占位符提示用户输入什么内容。
  • 有一个登录按钮。

CSS样式

  • 页面整体使用了浅灰色背景，字体为Arial或无衬线字体。
  • 登录框是一个白色的方块，有圆角、边框和阴影效果，看起来比较美观。
  • 输入框旁边有标签显示“用户：”和“密码：”，并且当输入框获得焦点时会有蓝色边框和阴影效果。
  • 登录按钮是蓝色的，鼠标悬停时颜色会变深一点。

JavaScript功能

  • 当用户名输入框获得焦点时，边框颜色变成蓝色，并且出现一个轻微的蓝色阴影效果。
  • 当用户名输入框失去焦点时，如果用户没有输入任何内容，则会弹出警告提示“用户名不能为空”。
  • 密码输入框的行为与用户名输入框类似，只是它检查的是密码是否为空。
  • 当点击登录按钮时，脚本会检查用户名和密码是否都已填写。如果有任何一个为空，就弹出警告说“用户名或密码不能为空”。如果都填写了，则会弹出一个消息窗口显示“登录成功！”以及用户输入的用户名和密码。

2.鼠标事件

  • click 鼠标单击出发
  • dbclick 鼠标双击出发
  • mouseover 鼠标悬浮触发
  • mouseenter 鼠标移入触发
  • mouseleave  鼠标移除出发
  • mousedown  鼠标任意按下按下出发
  • mouseup   鼠标任意案件抬起出发
  • mousemove  当元素内鼠标指针移动时持续触发

案例:单击鼠标使小球跳跃

1.代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>单击鼠标使小球跳跃</title><style>body {font-family: Arial, sans-serif;background-color: #f0f0f0;margin: 0;padding: 20px;display: flex;justify-content: center;align-items: center;height: 100vh;}#ballContainStyle {position: relative;width: 300px;height: 300px;background-color: #fff;border: 1px solid #ccc;border-radius: 5px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);overflow: hidden;}#ball {position: absolute;width: 30px;height: 30px;background-color: #007bff;border-radius: 50%;bottom: 0;left: 50%;transform: translateX(-50%);transition: all 0.5s ease;animation: ballBreath 1s linear infinite;}/*呼吸动画*/@keyframes ballBreath {0% {transform: scale(1);}50% {transform: scale(1.2);}100% {transform: scale(1);}}</style>
</head>
<body><div id="ballContainStyle"><div id="ball"></div></div><audio id="myAudio" src="https://freepd.com/music/The%20Celebrated%20Minuet.mp3" loop autoplay hidden></audio><script>// 获取容器和小球var ballContain = document.querySelector("#ballContainStyle");var ball = document.querySelector("#ball");// 初始化小球位置ball.style.bottom = '0px';// 点击事件处理ballContain.onclick = function () {// 获取小球当前的 bottom 值var ballBottom = parseInt(ball.style.bottom || 0);// 计算新的 bottom 值var newBottom = ballBottom + 200; // 向上跳// 检查新位置是否有效if (0 <= newBottom && newBottom <= ballContain.clientHeight) {ball.style.bottom = newBottom + "px";ball.style.transition = "all 0.5s ease";}};// 使用 setInterval() 小球自动下落setInterval(function () {// 获取小球当前的 bottom 值var ballBottom = parseInt(ball.style.bottom || 0);// 计算新的 bottom 值var newBottom = ballBottom - 10; // 向下落// 检查新位置是否有效if (0 <= newBottom && newBottom <= ballContain.clientHeight) {ball.style.bottom = newBottom + "px";} else if (newBottom < 0) { // 如果超出范围，重置到底部ball.style.bottom = '0px';}}, 30);</script>
</body>
</html>

2.效果

3.解释

  1. HTML部分:

    • 页面有一个标题“使用左右键控制小球移动”。
    • 有一个300x300像素大小的白色方块（#ballContainStyle），里面包含一个蓝色的小球（#ball）。
    • 页面还有一段隐藏的背景音乐，会自动播放并循环。

  2. CSS样式:

    • 整个页面居中显示，背景颜色是浅灰色。
    • 小球容器有圆角、边框和阴影效果，看起来更美观。
    • 小球是一个圆形，初始位置在容器底部中间，并且它会周期性地放大缩小，像是在呼吸一样。

  3. JavaScript功能:

    • 当你点击小球容器时，小球会向上跳起一段距离。
    • 每隔30毫秒（大约每秒33次），小球会自动向下落一点。如果小球掉到容器外面了，它会重新出现在容器底部。
    • 如果你按住左箭头键，小球会向左边移动；当你松开右箭头键时，小球会向右边移动。不过这里有个小问题：通常我们会在按键按下时处理移动逻辑，而不是在按键松开时。所以可能需要调整一下，让右箭头键也在按下时就触发移动。

3.键盘事件

  • keypress    按键盘按键时触发
  • keydown    按键盘按键时触发
  • keyup         键盘按键弹起时触发

案例:使用左右键控制小球左右移动

1.代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>使用左右键控制小球移动</title><style>body {font-family: Arial, sans-serif;background-color: #f0f0f0;margin: 0;padding: 20px;display: flex;justify-content: center;align-items: center;height: 100vh;}#ballContainStyle {position: relative;width: 300px;height: 300px;background-color: #fff;border: 1px solid #ccc;border-radius: 5px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);overflow: hidden;}#ball {position: absolute;width: 30px;height: 30px;background-color: #007bff;border-radius: 50%;bottom: 0;left: 50%;transform: translateX(-50%);transition: all 0.5s ease;animation: ballBreath 1s linear infinite;}/*呼吸动画*/@keyframes ballBreath {0% {transform: scale(1);}50% {transform: scale(1.2);}100% {transform: scale(1);}}</style>
</head>
<body><div id="ballContainStyle"><div id="ball"></div></div><audio id="myAudio" src="https://freepd.com/music/The%20Celebrated%20Minuet.mp3" loop autoplay hidden></audio><script>// 获取容器和小球var ballContain = document.querySelector("#ballContainStyle");var ball = document.querySelector("#ball");// 初始化小球位置ball.style.bottom = '0px';// 点击事件处理ballContain.onclick = function () {// 获取小球当前的 bottom 值var ballBottom = parseInt(ball.style.bottom || 0);// 计算新的 bottom 值var newBottom = ballBottom + 200; // 向上跳// 检查新位置是否有效if (0 <= newBottom && newBottom <= ballContain.clientHeight) {ball.style.bottom = newBottom + "px";ball.style.transition = "all 0.5s ease";}};// 使用 setInterval() 小球自动下落setInterval(function () {// 获取小球当前的 bottom 值var ballBottom = parseInt(ball.style.bottom || 0);// 计算新的 bottom 值var newBottom = ballBottom - 10; // 向下落// 检查新位置是否有效if (0 <= newBottom && newBottom <= ballContain.clientHeight) {ball.style.bottom = newBottom + "px";} else if (newBottom < 0) { // 如果超出范围，重置到底部ball.style.bottom = '0px';}}, 30);//左键小球位移向左移动document.onkeydown = function (event) {var keyCode = event.keyCode;//这是键盘按下时触发//如果是左键的话修改小球位置// 左键if (keyCode === 37) {var ballLeft = parseInt(ball.style.left || 50);var newLeft = ballLeft - 10;if (newLeft >= 0) {ball.style.left = newLeft + "%";}}}//右键小球向右移动document.onkeyup = function (event) {var keyCode = event.keyCode;//这是键盘弹起时触发//如果是右键的话修改小球位置// 右键if (keyCode === 39) {var ballLeft = parseInt(ball.style.left || 50);var newLeft = ballLeft + 10;if (newLeft <= 100) {ball.style.left = newLeft + "%";}}}</script>
</body>
</html>

2.效果

 

3.解释

  1. HTML结构:

    • 页面有一个标题“使用左右键控制小球移动”。
    • 有一个容器#ballContainStyle，里面包含一个小球#ball。
    • 还有一段隐藏的背景音乐。

  2. CSS样式:

    • 页面设置了背景颜色、居中对齐等基本样式。
    • 小球容器是一个300x300像素的白色盒子，有轻微的阴影效果。
    • 小球是蓝色的圆形，初始位置在容器底部中央，并且有一个呼吸动画让它周期性地放大缩小。

  3. JavaScript功能:

    • 当你点击小球容器时，小球会向上跳起一定距离。
    • 每隔30毫秒（即每秒约33次），小球会自动向下落一点，如果它落到容器底部以下，则会重新出现在底部。
    • 如果按下左箭头键（键盘上的向左箭头），小球会向左移动一段距离。
    • 如果松开右箭头键（键盘上的向右箭头），小球会向右移动一段距离。不过这里有个小错误，通常我们会在按键按下的时候处理移动逻辑，而不是在按键松开的时候。

相关文章：

javaScript操作dom的事件（3个案例+代码+效果图）

目录 1.焦点事件 案例:登录表单的验证 1.代码 2.效果 3.解释 2.鼠标事件 案例:单击鼠标使小球跳跃 1.代码 2.效果 3.解释 3.键盘事件 案例:使用左右键控制小球左右移动 1.代码 2.效果 ​编辑 3.解释 1.焦点事件 focus 当获得焦点时出发(不会冒泡)blur 当失去焦点时出发(不会…...

编程日记 2024/10/8 4:18:09

国庆期间的问题，如何在老家访问杭州办公室的网络呢

背景&#xff1a;国庆期间的问题&#xff0c;如何在老家访问杭州办公室的网络呢 实现方案&#xff1a;异地组网 实现语言&#xff1a;Java 环境&#xff1a;三个网络&#xff0c;一台拥有公网IP的服务器、一台杭州本地机房内服务器、你老家所在网络中的一台电脑&#xff08;…...

编程日记 2024/10/8 4:17:07

动态规划算法——三步问题

1.题目解析 2.算法原理 本题可以近似看做泰波那契数列&#xff0c;即小孩到第一个台阶需要一步&#xff0c;到第二个台阶则是到第一个台阶的步数加上第一阶到第二阶的步数&#xff0c;同理第三阶就是第二阶的步数加上第二阶到第三阶的步数&#xff0c;由于小孩只能走三步&#…...

编程日记 2024/10/8 4:08:58

【鸿蒙学习】深入解析鸿蒙应用与元服务：含义、区别、应用场景及创建方法

文章目录 鸿蒙应用&#xff08;HarmonyOS App&#xff09;含义用于干什么优缺点 元服务&#xff08;Atomic Service&#xff09;含义用于干什么优缺点 鸿蒙应用与元服务的区别创建方法鸿蒙应用的创建元服务的创建 总结 随着科技的不断进步&#xff0c;操作系统也在不断迭代更新…...

编程日记 2024/10/8 4:03:53

React学习01 jsx、组件与组件的三大属性

文章目录 jsx的介绍与语法1.真实DOM和虚拟DOM2.jsx语法 模块与模块化&#xff0c;组件与组件化模块与模块化组件与组件化 React组件React事件绑定函数式组件类式组件组件属性state组件属性props组件属性ref 尚硅谷react教程官方文档学习记录笔记01 jsx的介绍与语法 1.真实DOM和…...

编程日记 2024/10/8 4:02:52

项目——超级马里奥——Day(3)

一、游戏开发思路&#xff1a; 1.Frame--->BackGround--->Obstacle---->BufferedImage&#xff0c;人物等 2.BackGround的构造函数&#xff1a; 只要记住窗口里边的每一个场景&#xff0c;只要游戏一开始就已经出现在屏幕里边的&#xff0c;都是在构造函数里边 3.绘…...

编程日记 2024/10/8 3:59:48

测试-BUG篇

文章目录 软件测试的生命周期BUGbug的概念描述bug的要素bug级别bug的生命周期 与开发产生争执怎么办&#xff08;高频考题&#xff09; 软件测试的生命周期 软件测试贯穿于软件的整个生命周期 BUG bug的概念 是指计算机程序中存在的一个错误(error)、缺陷(flaw)、疏忽(mista…...

编程日记 2024/10/8 3:57:46

vue2中 vue-count-to组件让数字从某个数字动态的显示到某个数字(后附vue3的用法)

1、首先安装 npm install vue-count-to2、使用 2.1、先导入组件 import countTo from ‘vue-count-to’2.2、注册组件 components: { countTo },2.3、使用组件 <countTo> <template><div class"home"><countTo class"count-to&qu…...

编程日记 2024/10/8 3:56:44

AI模型部署初认识

AI部署这个词儿大家肯定不陌生&#xff0c;可能有些小伙伴还不是很清楚这个是干嘛的&#xff0c;但总归是耳熟能详了。 近些年来&#xff0c;在深度学习算法已经足够卷卷卷之后&#xff0c;深度学习的另一个偏向于工程的方向–部署工业落地&#xff0c;才开始被谈论的多了起来…...

编程日记 2024/10/8 3:55:43

在线生成论文的网站有哪些？分享5款AI一键原创论文免费网站

一、千笔-AIPasspaper 千笔-AIPasspaper是一款备受推荐的AI写作助手&#xff0c;它集成了多种功能&#xff0c;包括论文大纲生成、内容填充、文献引用和查重修改等。这款工具基于最新的自然语言处理技术&#xff0c;能够帮助用户快速生成高质量的论文内容。 AI论文&#xff0…...

编程日记 2024/10/8 3:53:41

考研论坛平台|考研论坛小程序系统|基于java和微信小程序的考研论坛平台小程序设计与实现(源码+数据库+文档)

考研论坛平台小程序 目录 基于java和微信小程序的考研论坛平台小程序设计与实现 一、前言 二、系统功能设计 三、系统实现 四、数据库设计 1、实体ER图 五、核心代码 六、论文参考 七、最新计算机毕设选题推荐 八、源码获取&#xff1a; 博主介绍&#xff1a;✌️大厂…...

编程日记 2024/10/8 3:52:40

Pandas 时间序列处理

Pandas 时间序列处理 说明&#xff1a; 请回答以下问题&#xff0c;以展示您对 pandas 中时间序列处理的全面理解。请在适用时提供代码示例。 问题 1 如何将日期字符串列表 [2023-01-01, 2023-01-02, 2023-01-03] 转换为 pandas 的 DatetimeIndex&#xff1f; 问题 2 给定一…...

编程日记 2024/10/8 3:50:37

PCL 1.8.1 + VTK 1.8.0 + QT5.14.2+ VS2017 环境搭建

先看看效果： PCL 1.8.1下载安装： Tags PointCloudLibrary/pcl GitHub 安装完成后： 如果VTK想重新编译的，可以看我的这篇博客：...

编程日记 2024/10/8 3:48:35

微信小程序和抖音小程序的分享和广告接入代码

开发完成小程序或者小游戏之后&#xff0c;我们为什么要接入分享和广告视频功能&#xff0c;主要原因有以下几个方面。 微信小程序和抖音小程序接入分享和广告功能主要基于以下几个原因&#xff1a; 用户获取与增长&#xff1a;分享功能可以帮助用户将小程序内容传播给更多人&…...

编程日记 2024/10/8 3:46:33

中断系统的原理

一、介绍 中断是为使单片机具有对外部或内部随机发生的事件实时处理而设置的。中断是指‌CPU在正常运行程序时&#xff0c;由于内部或外部事件的发生&#xff0c;导致CPU中断当前运行的程序&#xff0c;转而去执行其他程序的过程。‌ 中断可以是硬件产生的&#xff0c;也可以是…...

编程日记 2024/10/8 3:45:32

安装Rust

Rust 是一种系统级编程语言&#xff0c;旨在提供高性能和内存安全&#xff0c;同时避免常见的编程错误。 由 Mozilla Research 推出&#xff0c;Rust 自推出以来因其独特的设计理念和强大的功能而在开发者社区中迅速获得了广泛的关注和采用。 curl --proto ‘https’ --tlsv1.2…...

编程日记 2024/10/8 3:44:31

vite学习教程05、vite+vue2构建本地 SVG 图标

文章目录 前言一、构建本地SVG图标详细步骤1、安装开发依赖2、配置vite2.1、配置vite.config.js2.2、封装vite引入插件脚本 解决报错&#xff1a;can not find package fast-glob imported 二、实际应用应用1&#xff1a;未封装&#xff0c;直接vue应用应用2&#xff1a;封装vu…...

编程日记 2024/10/8 3:41:27

机器学习——自监督学习与无监督学习

# 机器学习中的自监督学习与无监督学习 在机器学习的世界中&#xff0c;监督学习、无监督学习和自监督学习都是重要的学习方法。本文将聚焦于自监督学习与无监督学习&#xff0c;探讨它们的原理、应用场景以及技术细节&#xff0c;并通过大量代码示例来揭示这些方法的内在工作…...

编程日记 2024/10/8 3:38:24

2003经典绝版100%仿盛大服务端火炬引擎原版

;中国游戏制作 本版本为中国游戏制作小组推出的第一个版本&#xff0c;有什么不完美的地方还请大家多多指教&#xff01;&#xff01;&#xff01; 与盛大逼真&#xff01;&#xff01;&#xff01; 本版本M2Server采用“梦幻风”以及“冰眼”M2Server修改器修改的 2004/1/…...

编程日记 2024/10/8 3:37:23

银河麒麟服务器：更新软件源

银河麒麟服务器&#xff1a;更新软件源 1、使用场景2、操作步骤3、注意事项 &#x1f490;The Begin&#x1f490;点点关注&#xff0c;收藏不迷路&#x1f490; 1、使用场景 当需要安装最新软件或修改软件源配置后&#xff0c;需更新软件源以获取最新软件包信息。 2、操作步…...

编程日记 2024/10/8 3:34:20

Gradio实战：用gr.Button和gr.Markdown打造高颜值交互界面（附CSS美化技巧）

Gradio界面美学革命&#xff1a;从基础组件到高级定制的全链路设计指南 在AI应用爆炸式增长的今天&#xff0c;一个美观直观的交互界面已经成为产品成功的关键因素。Gradio作为最受欢迎的AI应用快速构建工具&#xff0c;其默认样式往往难以满足专业级产品的视觉需求。本文将带您…...

编程新知 2026/3/28 7:31:16

SmolVLA效果展示：三视角图像对齐误差对最终动作精度影响分析

SmolVLA效果展示&#xff1a;三视角图像对齐误差对最终动作精度影响分析 1. 项目概述 SmolVLA是一个专门为经济实惠的机器人技术设计的紧凑高效视觉-语言-动作模型。这个模型最大的特点是能够在有限的硬件资源下实现高质量的机器人控制&#xff0c;让更多开发者和研究者能够接…...

编程新知 2026/3/28 7:16:57

避坑指南：解决Livox Mid-360双雷达点云融合时坐标系错乱与IMU数据混杂问题

Livox Mid-360双雷达点云融合实战&#xff1a;坐标系校准与IMU数据分离全解析 当你在RViz中看到两个Livox Mid-360雷达的点云像醉酒的水母一样随机飘动&#xff0c;而IMU数据又像被搅拌机混合过的果汁——恭喜你&#xff0c;遇到了多传感器融合的经典难题。这不是简单的参数调整…...

编程新知 2026/3/28 6:36:48

智能邮件秘书：OpenClaw+Qwen3.5-9B自动分类与回复

智能邮件秘书&#xff1a;OpenClawQwen3.5-9B自动分类与回复 1. 为什么需要自动化邮件处理&#xff1f; 每天早晨打开邮箱时&#xff0c;看到堆积如山的未读邮件总会让人头皮发麻。作为一位经常需要处理客户咨询的技术顾问&#xff0c;我最高纪录是一天收到187封邮件。即使每…...

编程新知 2026/3/28 5:07:22

嵌入式C++ RAII互斥锁封装器MutexLocker详解

1. MutexLocker&#xff1a;嵌入式C RAII风格互斥锁封装器深度解析1.1 设计动机与工程价值在基于mbed RTOS&#xff08;现为Mbed OS中CMSIS-RTOS v2兼容层&#xff09;的嵌入式实时系统开发中&#xff0c;互斥量&#xff08;Mutex&#xff09;是保障多任务共享资源安全访问的核…...

编程新知 2026/3/28 4:56:13

别再只会docker push了！Harbor镜像上传的5个隐藏技巧与实战避坑指南

Harbor镜像上传实战&#xff1a;5个高阶技巧与避坑指南 当你在凌晨三点被CI/CD流水线的失败通知惊醒&#xff0c;发现又是镜像上传问题导致整个发布流程卡住时&#xff0c;就会明白掌握Harbor的进阶用法有多重要。作为企业级容器镜像仓库&#xff0c;Harbor远比简单的docker pu…...

编程新知 2026/3/28 3:49:47

陀螺匠企业助手-产品

1. 功能说明维护出售产品的基本信息数据&#xff0c;支持在添加商机/合同中进行选择。2. 进入产品页面路径&#xff1a;客户>产品管理>产品3. 新增产品功能说明&#xff1a;维护产品信息&#xff0c;添加完成的产品信息&#xff0c;可以在添加商机/合同中进行选择。新增产…...

编程新知 2026/3/28 1:56:13

从‘偏差-方差’到一行代码：用NumPy/PyTorch五步实现GAE，附PPO实战避坑点

从‘偏差-方差’到一行代码&#xff1a;用NumPy/PyTorch五步实现GAE&#xff0c;附PPO实战避坑点 强化学习中的策略优化常常面临一个核心挑战&#xff1a;如何准确评估动作的价值&#xff1f;广义优势估计&#xff08;GAE&#xff09;通过巧妙平衡偏差与方差&#xff0c;成为PP…...

编程新知 2026/3/28 1:21:40

基于MATLAB的数字图像处理系统：预处理、特征提取与语义分割全流程实现

数字图像处理系统&#xff08;基于matlab&#xff09; 此系统包括预处理&#xff0c;特征提取&#xff0c;语义分割 使用机器学习算法knn和svm 预处理包括线性灰度级变化&#xff0c;指数灰度级变化&#xff0c;直方图均衡化&#xff0c;高斯滤波&#xff0c;中值滤波&#xff…...

编程新知 2026/3/28 1:11:38

企业级 Agent SKILL 最佳实践

最近&#xff0c;真的是屁颠屁颠地使用Openclaw作为业务核心为客户打造智能体的工作流程&#xff0c;包括组织、业务、技术三个全面的转型。同时&#xff0c;由于OpenAI的Sora下线&#xff0c;年初刚刚建立的AI漫剧工作流&#xff0c;资产库以及提示词都需要转换成替代品。还有…...

编程新知 2026/3/28 0:59:34