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

Js进阶31-DOM 操作专题

news 文章来源：https://blog.csdn.net/m0_57521762/article/details/135469029 2024/10/21 13:28:14

1. JavaScript 的组成部分：

ECMAScript：简称 ES，它是欧洲计算机协会，大概每年的六月中旬定制语法规范。
DOM：全称 Document Object Model，即为文档对象类型。
BOM：全称 Browser Object Model，即为浏览器对象类型。

2. 节点树

节点即为标签，节点之间的这种关系，我们称之为“节点树”，因为很像一棵大树。

DOM：文档对象类型，可以理解为是整个节点树最外层“根元素”。DOM 其实就是 JS 语言中内置的引用类型 document 对象，DOM 对象经常用来操作节点，也就是标签。比如节点样式、属性、文本等等。

<script type="text/javascript">// DOM：其实就是内置的 document 对象，引用类型数据console.log(document);  // #documentconsole.log(typeof document); // object
</script>

3. DOM 属性

DOM 在 JS 中，是引用类型数据，官方给我们提供了很多属性进行操作 DOM。

documentElement：获取节点树的 html 标签
head：获取节点树的 head 标签
title：获取节点 title 标签的文本
body：获取节点树的 body 标签

<script type="text/javascript">// DOM 常用属性// documentElement：获取节点树的 html 标签console.log(document.documentElement); // <html>...</html>// head：获取节点树的 head 标签console.log(document.head); // <head>...</head>// title：获取节点 title 标签的文本console.log(document.title); // 节点树认知// body：获取节点树的 body 标签console.log(document.body); // <body>...</body>
</script>

4. DOM 方法

官方也给我们提供了很多方法用来操作节点树上的标签，返回获取到的节点对象（单个）。

<!DOCTYPE html>
<html lang="en">
<head><meta id="cur" charset="UTF-8"><title>Title</title><style type="text/css">* {margin: 0;padding: 0;}#box {color: red;text-indent: 3em;background-color: cyan;}</style>
</head>
<body><div id="box">我爱你我的祖国</div><ul><li>1</li><li id="me">2</li><li class="green">3</li><li>4</li><li class="green">5</li></ul><input type="checkbox" name="hobby" /> 读书<input type="checkbox" name="hobby" /> 游泳<input type="checkbox" name="hobby" /> 画画
</body>
</html>

(1) getElementById

getElementById 方法是 document 对象的方法，可以通过标签的 Id 属性，在节点树中获取节点。

// getElementById 方法：可以根据 id 获取到节点树上的任意节点。需要给标签添加 id 属性，通过 id 选择器获取
const element = document.getElementById('box');
const eleCur = document.getElementById('cur');
const eleMe = document.getElementById('me');
console.log(element); // <div id="box">...</div>
console.log(eleCur); // <meta id="cur" charset="UTF-8">
console.log(eleMe); // <li id="me">2</li>
console.log(typeof element); // object

getElementById 方法可以通过标签 ID 选择器获取对应节点。
一般我们将 script 标签放在程序最底部。
不管节点（标签）在网页中嵌套关系如何复杂，都可以通过这个方法获取。
注意：节点（标签）在 JS 中属于引用类型数据。

(2) getElementsByName

getElementsByName 方法可以根据 name 属性获取到节点树上的节点，返回获取到的所有节点（多个）。

// getElementsByName 方法：可以根据 name 获取到节点树上的任意节点。需要给标签添加 name 属性，通过 name 选择器获取
const eleHobbies = document.getElementsByName('hobby');
console.log(eleHobbies); // NodeList(3) [input, input, input]

这个方法在实际应用中有些限制，它通常用于获取带有 name 属性的表单元素，如 input、button、select 标签等。

(3) getElementsByTagName

getElementsByTagName 方法可以根据标签名获取到节点树上的节点，返回获取到的所有节点（多个）。

// getElementsByTagName 方法：可以根据标签名获取到节点树上的任意节点。
const eleDivs = document.getElementsByTagName('div');
const eleLis = document.getElementsByTagName('li');
console.log(eleDivs); // HTMLCollection(1) [div#box]
console.log(eleLis); // HTMLCollection(5) [li, li#me, li.green, li, li.green]

(4) getElementsByClassName

getElementsByClassName 方法可以根据类名获取到节点树上的节点，返回获取到的所有节点（多个）。

// getElementsByClassName 方法：可以根据类名获取到节点树上的任意节点，需要给标签添加 class 属性，通过类选择器获取
const eleGreens = document.getElementsByClassName('green');
console.log(eleGreens); // HTMLCollection(2) [li.green, li.green]

(5) querySelector

querySelector 方法可以根据 css 选择器获取到节点树上的节点，返回第一个匹配的节点（单个）。

// querySelector 方法：可以根据 css 选择器获取到节点树上的任意节点
const eleBox = document.querySelector('#box');
const eleLi = document.querySelector('li');
const eleGreen = document.querySelector('.green');
console.log(eleBox); // <div id="box">...</div>
console.log(eleLi); // <li>1</li>
console.log(eleGreen); // <li class="green">3</li>

(6) querySelectorAll

querySelectorAll 方法可以根据 css 选择器获取到节点树上的节点，返回所有匹配的节点（多个）。

// querySelectorAll 方法：可以根据 css 选择器获取到节点树上的任意节点
const eleLisAll = document.querySelectorAll('li');
console.log(eleLisAll); // NodeList(5) [li, li#me, li.green, li, li.green]

上面这些用于获取 DOM 节点的方法可以从任意的父节点调用，而不仅仅是从 document 对象。这意味着我们可以从任何特定的 DOM 元素开始搜索，以获取其子元素或者与之相关的元素。

1 通过 id 获取元素
从任何节点调用 getElementById 并不常见，因为 id 应该是唯一的，所以 document.getElementById 已足够。但理论上，从某个较大的节点开始调用此方法，它仍然会在整个文档范围内查找该 id。

2 通过类名获取一组元素
var elements = parentNode.getElementsByClassName('className');
这里，parentNode 可以是任何 DOM 节点，它将返回该节点下所有具有指定类名的子元素。

3 通过标签名获取一组元素
var elements = parentNode.getElementsByTagName('tagName');
类似地，parentNode 是想要开始搜索的节点，它将返回该节点下所有具有指定标签名的子元素。

4 通过 CSS 选择器获取一个元素
var element = parentNode.querySelector('.className');
在这里，parentNode.querySelector 将返回第一个匹配 CSS 选择器的子元素。

5 通过 CSS 选择器获取一组元素
var elements = parentNode.querySelectorAll('.className');
这将返回 parentNode 下所有匹配 CSS 选择器的子元素。

在使用这些方法时，只要确保 parentNode 是一个有效的 DOM 节点即可。这种方法的优势在于它允许我们更具体地定位搜索范围，从而在大型文档中更有效率地找到需要的元素。

getElementsByName 实际上是一个定义在 document 对象上的方法。这意味着它不能从任意父节点调用，而只能从 document 调用。

例如，document.getElementsByName('nameValue') 是有效的，但如果尝试从非 document 节点调用此方法，则会导致错误。

5. 操作 DOM 节点

我们可以通过 DOM 方法获取到节点树上的任意节点（标签），经常通过点语法来操作节点的属性、文本、样式等。

(1) 操作节点属性

我们可以通过 DOM 方法获取节点，进而操作节点属性。

通过节点对象.属性名，可以获取节点某一个属性的属性值，当然也可以通过 JS 来动态设置新的属性值。

<div id="box" class="cur">我是祖国的未来</div>
<div><input type="text" id="box1">
</div>

// JS 当中经常通过 DOM 获取节点，经常用来操作节点属性
const div = document.getElementById('box');
const input = document.getElementById('box1');// 获取节点属性值
console.log(div.id); // box
console.log(div.className); // cur
console.log(input.type); // text// 设置节点属性值
div.id = 'memeda';
div.className = 'hahaha';
input.type = 'password';

也可以通过节点对象的 getAttribute 方法和 setAttribute 方法来操作节点属性。
// 获取节点属性
console.log(div.getAttribute('id')); // box
console.log(input.getAttribute('type')); // text// 设置节点属性
div.setAttribute('id', 'memeda');
input.setAttribute('type', 'password');

(2) 操作节点文本

我们可以通过 DOM 对象提供的方法获取对应的节点，我们也可以通过点语法操作节点文本。

节点开始标签和结束标签之间的内容就称为节点的文本。
<p>段落文本</p>
上面的“段落文本”就是 p 标签的文本。

<p id="cur">我最近想学习 web 前端</p>
<p><input type="text" id="container" value="我是默认的文本，需通过 value 属性获取和设置">
</p>

操作节点文本分为两种情况：

操作表单元素文本，需要通过 value 属性进行操作。

// 表单元素：input、select、textarea、button 这些元素
// 表单元素操作文本，需要使用 value 属性
const input = document.getElementById('container');
// 获取文本
console.log(input.value); // 我是默认的文本，需通过 value 属性获取和设置
// 设置文本
input.value = '通过 JS 给表单元素重新设置新的文本';

操作非表单元素，需要通过 innerHTML 属性和 InnerText 属性进行操作。

// 非表单元素：不是 input、select、textarea、button 这些元素，如 div、span、a、img 等
// 非表单元素操作文本，需要使用 innerHTML 属性和 innerText 属性
const p = document.getElementById('cur');
// 获取文本
p.innerHTML = '我最近想学习 <span style="color: red;">web 前端</span>';
p.innerText = '我是中国最帅的帅大哥';
// 设置文本
p.innerHTML = '我是中国最帅的帅大哥';

(3) 操作节点样式

我们可以通过 DOM 方法获取节点，可以操作节点的行内样式。

<p id="box" style="width: 100px; height: 100px; color: red; background-color: cyan">我是大帅哥</p>

// 获取节点
const p = document.getElementById('box');// 获取节点的行内样式
console.log(p.style); // CSSStyleDeclaration {0: "width", 1: "height", 2: "color", 3: "background-color", width: "100px", height: "100px", color: "red", backgroundColor: "cyan", length: 4}
console.log(p.style.width); // 100px
console.log(p.style['color']); // red// 设置节点的行内样式
p.style.width = '200px';
p.style.height = '200px';
p.style['color'] = 'cyan';
p.style.backgroundColor = 'red'; // 驼峰

在 JS 中点语法操作行内样式。
通过 JS 代码，可以获取行内样式（内部样式和外部样式不可以），当然也可以设置行内样式。
节点样式 background-color、font-size 等中间带有横杠的样式，样式名需变为驼峰写法。

Js进阶31-DOM 操作专题

1. JavaScript 的组成部分： ECMAScript：简称 ES，它是欧洲计算机协会，大概每年的六月中旬定制语法规范。DOM：全称 Document Object Model，即为文档对象类型。BOM：全称 Browser Object Model&…...

编程日记 2024/1/10 8:28:24

Hive之set参数大全-4

F 指定在使用 FETCH 命令提取查询结果时的序列化/反序列化器 hive.fetch.output.serde 是 Hive 的一个配置参数，用于指定在使用 FETCH 命令提取查询结果时的序列化/反序列化器。以下是一个示例： -- 设置 hive.fetch.output.serde 为 org.apache.had…...

编程日记 2024/1/10 8:26:22

竞赛保研基于深度学习的人脸识别系统

前言 🔥 优质竞赛项目系列，今天要分享的是基于深度学习的人脸识别系统该项目较为新颖，适合作为竞赛课题方向，学长非常推荐！ 🧿 更多资料, 项目分享： https://gitee.com/dancheng-senior/…...

编程日记 2024/1/10 8:23:19

9.建造者模式

文章目录一、介绍二、代码三、实际使用总结一、介绍建造者模式旨在将一个复杂对象的构建过程和其表示分离，以便同样的构建过程可以创建不同的表示。这种模式适用于构建对象的算法（构建过程）应该独立于对象的组成部分以及它们的装配方式的…...

编程日记 2024/1/10 8:22:18

简单的MOV转MP4方法

1.下载腾讯的QQ影音播放器, 此播放器为绿色视频播放器, 除了播放下载好的视频外没有臃肿无用功能官网 QQ影音百度网盘链接：https://pan.baidu.com/s/1G0kSC-844FtRfqGnIoMALA 提取码：dh4w 2.用QQ影音打开MOV文件 3.右下角打开影音工具箱 , 选择截取…...

编程日记 2024/1/10 8:21:17

YOLOv8改进 | Neck篇 | 利用ASF-YOLO改进特征融合层（适用于分割和目标检测）

一、本文介绍本文给大家带来的改进机制是ASF-YOLO（发布于2023.12月份的最新机制），其是特别设计用于细胞实例分割。这个模型通过结合空间和尺度特征，提高了在处理细胞图像时的准确性和速度。在实验中，ASF-YOLO在2018年数据科学竞赛数据集上取得了卓越的分割准确性和速度，…...

编程日记 2024/1/10 8:18:14

基于模块自定义扩展字段的后端逻辑实现（一）

目录一：背景介绍二：实现过程三：字段标准化四：数据存储五：数据扩展六：表的设计一：背景介绍最近要做一个系统，里面涉及一个模块是使用拖拉拽的形式配置模块使用的字段表…...

编程日记 2024/1/10 8:17:13

力扣：18.四数之和

一、做题链接：18. 四数之和 - 力扣（LeetCode） 二、题目分析 1.做这一道题之前本博主建议先看上一篇《三数之和》 2.题目分析给你一个由 n 个整数组成的数组 nums ，和一个目标值 target 。请你找出并返回满足下述全部条件且不重…...

编程日记 2024/1/10 8:13:09

1、定义接口 public interface MyInterceptorInterface 2、实现接口 public class MyInterceptorImpl : MyInterceptorInterface 在构造中增加以下代码，便于观察 static ConcurrentDictionary<string, string> keyValues new ConcurrentDictionary<s…...

编程日记 2024/1/10 8:12:08

Python轴承故障诊断 (十)基于VMD+CNN-Transfromer的故障分类

目录 1 变分模态分解VMD的Python示例 2 轴承故障数据的预处理 2.1 导入数据 2.2 故障VMD分解可视化 3 基于VMDCNN-Transformer的轴承故障诊断分类 3.1 定义VMD-CNN-Transformer分类网络模型 3.2 设置参数，训练模型 3.3 模型评估代码、数据如下&#xff1a…...

编程日记 2024/1/10 8:10:06

【复习】人工智能第7章专家系统与机器学习

专家系统就是让机器人当某个领域的专家，但这章专家系统不咋考，主要靠书上没有的机器学习。一、专家系统的基本组成二、专家系统与传统程序的比较 （1）编程思想： 传统程序数据结构算法专家系统知识推理 &…...

编程日记 2024/1/10 8:07:03

使用 Apache PDFBox 操作PDF文件

简介 Apache PDFBox库是一个开源的Java工具，专门用于处理PDF文档。它允许用户创建全新的PDF文件，编辑现有的PDF文档，以及从PDF文件中提取内容。此外，Apache PDFBox还提供了一些命令行实用工具。 Apache PDFBox提供了创建、渲染、…...

编程日记 2024/1/10 8:05:01

【Python 常用脚本及命令系列 3.2 -- 检测到弹框跳出然后关掉它--脚本实现】

文章目录简介脚本实现简介在Python中，你可以使用第三方库如pyautogui和pygetwindow来检测屏幕上的弹框并关闭它。这些库可以模拟鼠标和键盘操作，也可以获取窗口信息。首先，需要安装这些库（如果你还没有安装的话）&…...

编程日记 2024/1/10 8:03:59

junit单元测试：使用@ParameterizedTest 和 @CsvSource注解简化单元测试方法

在平常的开发工作中，我们经常需要写单元测试。比如，我们有一个校验接口，可能会返回多种错误信息。我们可以针对这个接口，写多个单元测试方法，然后将其场景覆盖全。那么，怎么才能写一个测试方法，…...

编程日记 2024/1/10 8:01:58

C# winform判断自身程序是否已运行，如果已运行则激活窗体

C# winform判断自身程序是否已运行，如果已运行则激活窗体 using System; using System.Collections.Generic; using System.Diagnostics; using System.Linq; using System.Reflection; using System.Runtime.InteropServices; using System.Threading; using Syst…...

编程日记 2024/1/10 7:59:55

超维空间M1无人机使用说明书——21、基于opencv的人脸识别

引言：M1型号无人机不仅提供了yolo进行物体识别，也增加了基于opencv的人脸识别功能包，仅需要启动摄像头和识别节点即可链接: 源码链接一、一键启动摄像头和人脸识别节点 roslaunch robot_bringup bringup_face_detect.launch无报错&#…...

编程日记 2024/1/10 7:58:55

Redis 持久化——AOF

文章目录为什么需要AOF?概念持久化查询和设置1. 查询AOF启动状态2. 开启AOF持久化2.1 命令行启动AOF2.2 配置文件启动 AOF 3. 触发持久化3.1 自动触发3.3 手动触发 4. AOF 文件重写4.1 什么是AOF重写？4.2 AOF 重写实现4.3 AOF 重写流程 5. 配置说明6. 数据恢复6.1…...

编程日记 2024/1/10 7:57:54

华为云服务介绍（二）

在华为云服务介绍（一）中我们看到华为云提供了一系列的云服务，包括计算、存储、网络、数据库、安全等方面的解决方案。通过灵活的系统架构设计，可以充分利用这些云服务技术，从而更好地满足用户的需求。本文从系统架构的角度出发，通过充分利用华为云提供的各种云服务技…...

编程日记 2024/1/10 7:55:52

mysql列题

mysql列题 1.查询学过「张三」老师授课的同学的信息2.查询没有学全所有课程的同学的信息3.查询没学过"张三"老师讲授的任一门课程的学生姓名4.查询两门及其以上不及格课程的同学的学号，姓名及其平均成绩5.检索" 01 "课程分数小于 60&#xff0c…...

编程日记 2024/1/10 7:53:50

cpu缓存一致性

文章目录 cpu缓存一致性缓存的出现：多核之后带来的缓存一致性问题，如何解决LOCK 指令（刚好可以实现上述的目标）LOCK 指令特性内存屏障特性编译器屏障的作用MESI协议为什么有了 MESI协议还需要内存屏障问题：总结&…...

编程日记 2024/1/10 7:52:49

Android Framework 常见解决方案（25-1）定制CPUSET解决方案-framework部分修改

1 原理说明这个方案有如下基本需求： 构建自定义CPUSET，/dev/cpuset中包含一个全新的cpuset分组。且可以通过set_cpuset_policy和set_sched_policy接口可以设置自定义CPUSET。开机启动后可以通过zygote判定来对特定的应用进程设置CPUSET，并…...

编程日记 2024/1/10 7:51:48

PyTorch 参数化深度解析：自定义、管理和优化模型参数

目录 torch.nn子模块parametrize parametrize.register_parametrization 主要特性和用途使用场景参数和关键字参数注意事项示例 parametrize.remove_parametrizations 功能和用途参数返回值异常使用示例 parametrize.cached 功能和用途如何使用示例…...

编程日记 2024/1/10 7:48:45

自承载 Self-Host ASP.NET Web API 1 (C#)

本教程介绍如何在控制台应用程序中托管 Web API。 ASP.NET Web API不需要 IIS。可以在自己的主机进程中自托管 Web API。创建控制台应用程序项目启动 Visual Studio，然后从“开始”页中选择“新建项目”。或者，从“ 文件 ”菜单中选择“ 新建 ”&a…...

编程日记 2024/1/10 7:47:44

Vue2-子传父和父传子的基本用法

在Vue 2中，可以使用props和$emit来实现子组件向父组件传值（子传父）和父组件向子组件传值（父传子）。子传父（子组件向父组件传值）的基本用法如下： 在父组件中定义一个属性&#xff…...

编程日记 2024/1/10 7:46:43

使用numpy处理图片——镜像翻转和旋转

在《使用numpy处理图片——基础操作》一文中，我们介绍了如何使用numpy修改图片的透明度。本文我们将介绍镜像翻转和旋转。镜像翻转上下翻转 from PIL import Image import numpy as np img Image.open(example.png) data np.array(img)# axis0 is vertical, a…...

编程日记 2024/1/10 7:41:38

HTML5 article标签，＜time＞...＜/time＞标签和pubdate属性的运用

1、<article>...</article>标签的运用 article标签代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。它可以是一篇博客或报竟杂志中的文章、一篇论坛帖子、一段用户评论或一个独立的插件，或者其他任何独立的内容。把文章正文放在h…...

编程日记 2024/1/10 7:39:37

Amazing OpenAI API：把非 OpenAI 模型都按 OpenAI API 调用

分享一个有趣的小工具，10MB 身材的小工具，能够将各种不同的模型 API 转换为开箱即用的 OpenAI API 格式。让许多依赖 OpenAI API 的软件能够借助开发者能够接触到的，非 OpenAI 的 API 私有部署和使用起来。写在前面这个小工具软件写于两…...

编程日记 2024/1/10 7:38:36

RK3568平台开发系列讲解（驱动篇）pinctrl 函数操作集结构体讲解

🚀返回专栏总目录文章目录一、pinctrl_ops二、pinmux_ops三、pinconf_ops沉淀、分享、成长，让自己和他人都能有所收获！😄 pinctrl_ops：提供有关属于引脚组的引脚的信息。pinmux_ops：选择连接到该引脚的功能。pinconf_ops：设置引脚属性（上拉，下拉，开漏，强度等）。…...

编程日记 2024/1/10 7:37:35

vue购物车案例，v-model 之 lazy、number、trim，与后端交互

购物车案例 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title><script src"./js/vue.js"></script> </head> <body> <div id"d1"&…...

编程日记 2024/1/10 7:33:32

云原生Kubernetes: Kubeadm部署K8S 1.29版本单Master架构

目录一、实验 1.环境 2.K8S master节点环境准备 3.K8S master节点安装kubelet、kubeadm、kubectl 3.K8S node节点环境准备与软件安装 4.K8S master节点部署服务 5.K8S node节点部署 6.K8S master节点查看集群 7.容器网络（CNI）部署 8.K8S 集群…...

编程日记 2024/1/10 7:32:31

C++协程操作

什么是C++协程 C++中的协程是一种用户态轻量级线程，它拥有自己的上下文和栈，并且协程的切换和调度由用户定义，不需要陷入内核。如同一个进程可以拥有多个线程，一个线程也可以拥有多个协程。协程的优点在于极高的执行效率，因为协程切换不需要陷入内核，而是由用户程序定义切…...

编程日记 2024/1/10 7:30:30

计算机配件杂谈-鼠标

目录基础知识鼠标的发展鼠标的左右手鼠标的显示样式鼠标的移动和可见性移动可见性现在的我们的生活工作都基本上离不开电脑了，不管是你平时玩玩游戏，上班工作等等； 今天将关于鼠标的一些小的技巧分享出来，共勉！ 基础…...

编程日记 2024/1/10 7:29:29

用Python来制作一个微信聊天机器人

1. 效果展示通过本地搭建一个flask服务器来接收信息，这里我简单使用展示，就没有对接收的信息进行处理了。信息接收展示发送信息展示这里就直接使用python发送一个post请求即可，可以发送文字或者图片代码展示接收信息 #!/usr/bin/e…...

编程日记 2024/1/10 7:28:28

2024年第九届机器学习技术国际会议(ICMLT 2024) 即将召开

2024年第九届机器学习技术国际会议（ICMLT 2024）将于2024年5月24-26日在挪威奥斯陆举行。ICMLT 2024旨在讨论机器学习技术领域的最新研究技术现状和前沿趋势，为来自世界各地的科学家、工程师、实业家、学者和其他专业人士提供一个互动和交流的…...

编程日记 2024/1/10 7:27:27

算法训练day9Leetcode232用栈实现队列225用队列实现栈

今天学习的文章和视频链接 https://programmercarl.com/%E6%A0%88%E4%B8%8E%E9%98%9F%E5%88%97%E7%90%86%E8%AE%BA%E5%9F%BA%E7%A1%80.html 栈与队列理论基础见我的博客 https://blog.csdn.net/qq_36372352/article/details/135470438?spm1001.2014.3001.5501 232用栈实现…...

编程日记 2024/1/10 7:26:26

linux驱动(四):platform

本文主要探讨x210驱动的平台设备类型(platform)以及misc设备。驱动模型设备驱动模型：总线(bus type)、设备(device)和驱动(driver) 总线：虚拟总线用于挂接驱动驱动和设备总线、设备、驱动关系：/sys/bus下的子目录…...

编程日记 2024/1/10 7:22:22

Guava：Cache强大的本地缓存框架

Guava Cache是一款非常优秀的本地缓存框架。一、经典配置 Guava Cache 的数据结构跟 JDK1.7 的 ConcurrentHashMap 类似，提供了基于时间、容量、引用三种回收策略，以及自动加载、访问统计等功能。基本的配置 Testpublic void testLoadingCache() th…...

编程日记 2024/1/10 7:21:21

#{}和${}的区别？

#{}是占位符，预编译处理；${}是拼接符，字符串替换，没有预编译处理。Mybatis在处理#{}时，#{}传入参数是以字符串传入，会将SQL中的#{}替换为?号，调用PreparedStatement的set方法来赋值。Mybatis在…...

编程日记 2024/1/10 7:20:20

string的模拟实现

string的模拟实现 msvc和g下的string内存比较成员变量构造函数与析构函数拷贝构造函数赋值拷贝c_str、size和capacity函数以及重载[]、clear、expand_capacity迭代器与遍历reservepush_back、append、insert字符串比较运算符erase<<流提取 >>流插入resizefindsubst…...

编程日记 2024/1/10 7:19:19

算法练习：查找二维数组中的目标值

题目： 编写一个高效的算法来搜索矩阵 matrix 中的一个目标值 target 。该矩阵具有以下特性：每行的元素从左到右升序排列。每列的元素从上到下升序排列。实现： 1. main方法 public static void main(String[] args) {int[][] matrix {{1…...

编程日记 2024/1/10 7:18:18

考研自命题资料、考题如何找

这篇文章是抖音和b站上上传的同名视频的原文稿件，感兴趣的csdn用户可以关注我的抖音和b站账号（GeekPower极客力量）。同时这篇文章也为视频观众提供方便，可以更加冷静地分析和思考。文章同时在知乎发表。去年我发布了一个视频&am…...

编程日记 2024/1/10 7:17:17

MySQL 存储引擎和索引类型介绍

1. 引言 MySQL 是一个流行的关系型数据库管理系统，提供多种存储引擎以满足不同的业务需求。本文将介绍几种常见的 MySQL 存储引擎和索引类型比较，并给出相应的示例。 2. 存储引擎概述 2.1 InnoDB 存储引擎 InnoDB 是 MySQL 的默认存储引擎&#xff0…...

编程日记 2024/1/10 7:15:15

element-ui table height 属性导致界面卡死

问题: 项目上，有个点击按钮弹出抽屉的交互, 此时界面卡死原因分析: 一些场景下(父组件使用动态单位/弹窗、抽屉中使用), element-ui 的 table 会循环计算高度值, 导致界面卡死 github 上的一些 issues 和解决方案: Issues ElemeFE/element GitHub 官方讲是升…...

编程日记 2024/1/10 7:12:12

Vue2.v-指令

v-if 在双引号中写判断条件。 <div v-if"score>90">A</div> <div v-else-if"score>80">B</div> <div v-else>C</div>v-on: :冒号后面跟着事件。为了简化，可以直接用代替v-on:。事件名“内联语…...

编程日记 2024/1/10 7:11:11

Java中SpringBoot组件集成接入【Knife4j接口文档（swagger增强）】

Java中SpringBoot组件集成接入【Knife4j接口文档】 1.Knife4j介绍2.maven依赖3.配置类4.常用注解使用1.实体类及属性（@ApiModel和@ApiModelProperty）2.控制类及方法（@Api、@ApiOperation、@ApiImplicitParam、 @ApiResponses）3.@ApiOperationSupport注解未生效的解决方法5.…...

编程日记 2024/1/10 7:09:09

继承和多态的详解

文章目录 1. 继承1.1 继承的概念1.3 继承的语法1.3 父类成员访问1.3.1 子类中访问父类的成员变量1.3.2 子类中访问父类的成员方法 1.4 子类构造方法 2.super关键字2.1 super关键字的概念2.2 super和this的区别 3. 在继承中访问限定符的可见性4. 继承方式的分类5. 多态5.1 多态的…...

编程日记 2024/1/10 7:07:08

【Unity】UniTask(异步工具)快速上手

UniTask(异步工具) 官方文档：https://github.com/Cysharp/UniTask/blob/master/README_CN.md URL:https://github.com/Cysharp/UniTask.git?pathsrc/UniTask/Assets/Plugins/UniTask 优点：0GC，可以在任何地方使用为Unity提供一个高性能&…...

编程日记 2024/1/10 7:05:05

k8s三种常用的项目发布方式

k8s三种常用的项目发布方式 1、蓝绿发布 2、金丝雀发布(灰度发布)：使用最多 3 、滚动发布应用程序升级，面临的最大问题是新旧业务之间的切换。项目的生命周期：立项----定稿----需求发布----开发----测试-----发布最后测试之后上线。再…...

编程日记 2024/1/10 7:04:04

Nodejs搭配axios下载图片

新建一个文件夹，npm i axios 实测发现只需保留node_modules文件夹，删除package.json不影响使用 1.纯下载图片其实该方法不仅可以下载图片，其他的文件都可以下载 const axios require(axios) const fs require(fs) var arrPic [https:…...

编程日记 2024/1/10 7:01:02

强化学习在生成式预训练语言模型中的研究现状简单调研

1. 绪论本文旨在深入探讨强化学习在生成式预训练语言模型中的应用，特别是在对齐优化、提示词优化和经验记忆增强提示词等方面的具体实践。通过对现有研究的综述，我们将揭示强化学习在提高生成式语言模型性能和人类对话交互的关键作用。虽然这些应用展示…...

编程日记 2024/1/10 6:58:59