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

0x02 js、Vue、Ajax

news 来源：原创 2025/9/10 17:40:11

文章目录

  • js
    • 核心概念
    • js脚本引入html的方式
    • 基础语法
    • 事件监听
  • Vue
    • vue简介
    • v-for
    • v-bind
    • v-if&v-show
    • v-model&v-on
  • Ajax

js

核心概念

JavaScript：是一门跨平台、面向对象的脚本语言，用来控制网页行为实现交互效果，由ECMAScript、BOM、DOM组成

ECMAScript：规定了JS基础语法核心知识，包括变量、数据类型、流程控制、函数、对象等

BOM：浏览器对象模型，用于操作浏览器本身，如：页面弹窗、地址栏操作、关闭窗口

DOM：文档对象模型，用于操作HTML文档，如：改变标签内的内容、改变标签内的字体样式

js脚本引入html的方式

内部引入

<body><script>alert('hello world')</script>
</body>

引入外部js文件

<!DOCTYPE html>
<html>
<head><title>外部脚本示例</title><!-- 方式1：在 head 中引入（需谨慎） --><script src="js/script.js"></script>
</head>
<body><button onclick="showMessage()">点击我</button><!-- 方式2：推荐在 body 末尾引入 --><script src="js/script.js"></script>
</body>
</html>

function showMessage() {alert("Hello from external JS!");
}

基础语法

变量和常量

JS中用let关键字来声明变量，javascript是弱类型语言，变量可以存放不同类型的值。

变量名：

  1. 只能用字母、数字、下划线、**美元符号（$）**组成，且数字不能开头
  2. 变量名严格区分大小写
  3. 不能使用关键字

JS中用const关键字来声明常量，一旦声明，常量的值就不能够改变（不可重新赋值）

alert是输出一个窗口，console是输出到控制台，这两种方式可以用于代码调试

数据类型：JavaScript的数据类型分为：基本数据类型和引用数据类型（对象）

基本数据类型：

  1. number：数字（整数、小数、NaN）
  2. boolean：布尔。true、false
  3. null：对象为空
  4. undefined：当声明的变量未初始化时，该变量的值默认为undefined
  5. string：字符串，单引号、双引号、反引号皆可，推荐使用单引号

typeof 可以获取数据类型

反引号定义的是模板字符串，类似python中的f字符串

JavaScript中函数通过function关键字进行定义

function functionName(参数1, 参数2 ...) {...
}
function add(a, b) {return a + b;
}

调用

let result = add(10, 20)
console.log(result)

匿名函数的定义

//函数表达式
let add = function(a, b) {return a + b;
}//箭头函数
let add = (a, b) => {return a + b;
}

对象类型

let 对象名 = {属性名1: 属性值1,属性名2: 属性值2,属性名3: 属性值3,方法名: function (形参列表) {}
} let user = {name: 'Tom',age: 20,gender: '男',sing: function () {alert(`${this.name}唱着最炫民族风`)}//sing () {//    alert(`${this.name}唱着最炫民族风`)//}
}//对象中的函数是可以进行简化的

需要注意的是在对象的方法中，使用箭头函数时，this并不是指向当前对象，而是指向当前对象的父对象

json：JavaScript Object Notation，Javascript对象标记法，由于json语法简单，层次结构鲜明，现多用作为数据载体，在网络中进行数据传输

1740616432971.png

DOM：Document Object Model，文档对象模型

将标记语言的各个组成部分封装为对应的对象

  1. Document：整个文档对象
  2. Element：元素对象
  3. Attribute：属性对象
  4. Text：文本对象
  5. Comment：注释对象

1740616777504.png

DOM操作的核心思想：将网页中所有的元素当作为对象来处理。

操作步骤：

  1. 获取要操作的DOM元素对象
  2. 操作DOM对象的属性或方法

获取DOM对象最灵活常用的方式是根据css选择器来获取DOM对象

//获取匹配到的第一个元素
document.querySelector('选择器')
//获取匹配到的所有元素，返回的是一个数组
document.querySelectorAll('选择器')

事件监听

事件监听：JavaScript可以在事件触发时，就立即调用一个函数做出响应，也称事件绑定或注册事件

语法：事件源.addEventListener('事件类型', 事件触发执行函数);

事件监听三要素：

  1. 事件源：哪个dom元素触发了事件，要获取dom元素
  2. 事件类型：用什么方式触发，比如：鼠标单击 click
  3. 事件触发执行的函数：要做什么事

常见事件

  1. 鼠标事件：click（鼠标点击）、mouseenter（鼠标移入）、mouseleave（鼠标移出）
  2. 键盘事件：keydown（键盘按下触发）、keyup（键盘抬起触发）
  3. 焦点事件：focus（获得焦点触发）、blur（失去焦点触发）
  4. 表单事件：input（用户输入时触发）、submit（表单提交时触发）

Vue

vue简介

Vue是一款用于构建用户界面的渐进式的JavaScript框架

渐进式指的是可以使用vue的一部分来构建我们的页面

<body><div id="app"><h1>{{ msg }}</h1></div><script type="module">// 1. 导入Vueimport { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'createApp({data(){return {msg: 'Hello Vue'}}}).mount('#app')</script>
  1. script标签中的type属性module指使用模块化js
  2. .mount('#app')是指让vue接管id为app部分

v-for

在html标签上带有**v-**前缀的就是vue指令

v-for：用于列表渲染，遍历容器的元素或者对象的属性

<tr v-for="(item,index) in items" :key="item.id">{{ item }}</tr>
  • items为遍历的数组
  • item为遍历出来的元素
  • index为索引/下标，从0开始；可以省略v-for="item in items"
  • key是给元素添加的唯一标识，便于vue进行列表项的正确排序复用

v-bind

v-bind的作用是动态地为HTML标签绑定属性值，如设置href、src、style样式等

语法：

<img v-bind:src="item.image" width="30px">

简化后的语法：

<img :src="item.image" width="30px">

动态的为标签的属性绑定值，不能使用插值表达式，需要使用v-bind指令。且绑定的数据需要在data中定义

v-if&v-show

v-if和v-show这两类指令都是用来控制元素的显示与隐藏的

<span v-if="gender == 1">男生</span>
<span v-show="gender == 1">男生</span>

v-if：基于条件判断，来控制创建或移除元素节点，可以配合v-else-if、v-else进行使用

v-show：基于css样式display来控制显示与隐藏，都会渲染只是控制显示与隐藏

对用户来说达到的效果是一样的

v-model&v-on

v-model：在表单元素上使用，双向数据绑定。可以方便的获取或设置表单项数据

语法：

v-model="变量名"

<body><input type="text" id=name v-model="searchForm.name"><script type="module">import {createApp} from  'https://unpkg.com/vue@3/dist/vue.esm-browser.js'createApp({data(){return {searchForm: {name: '',gender: '',job: ''}}}}).mount('#container')</script>
</body>

v-model中绑定的变量，必须在data中定义

v-on：为html标签绑定事件（添加事件监听）

语法：v-on:事件名="方法名"

简写为：@事件名="方法名"

<body><div id="app"><button type="button" v-on:click="handle">点我</button><button type="button" @click="handle">再点我</button></div><script type="module">import {createApp} from  'https://unpkg.com/vue@3/dist/vue.esm-browser.js'createApp({data(){...},methods: {handle() {console.log('hello v-on')   }}}).mount('#app')</script>
</body>

methods函数中的this指向Vue实例，可以通过this获取到data中定义的数据

Ajax

Ajax：Asynchronous JavaScript And XML，异步的Javascript和XML

XML：Extensible Markup Language 可扩展标记语言，本质是一种数据格式，可以用来存储复杂的数据结构

Ajax作用

  1. 数据交换：通过Ajax可以给服务器发送请求，并获取服务器相应的数据
  2. 异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页，如搜索联想、用户名是否可用的验证

1740629844672.png

Axios：对原生Ajax进行封装，简化书写，快速开发

要使用Axios，需要先引入，可以通过script标签进行引入

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

1740632780655.png

1740633448249.png

相关文章：

0x02 js、Vue、Ajax

文章目录 js核心概念js脚本引入html的方式基础语法事件监听 Vuevue简介v-forv-bindv-if&v-showv-model&v-on Ajax js 核心概念 JavaScript&#xff1a;是一门跨平台、面向对象的脚本语言&#xff0c;用来控制网页行为实现交互效果&#xff0c;由ECMAScript、BOM、DOM…...

编程日记 2025/9/10 17:40:11

如何使用Docker搭建哪吒监控面板程序

哪吒监控（Nezha Monitoring）是一款自托管、轻量级的服务器和网站监控及运维工具，旨在为用户提供实时性能监控、故障告警及自动化运维能力。 文档地址：https://nezha.wiki/ 本章教程，使用Docker方式安装哪吒监控面板，在此之前，你需要提前安装好Docker. 我当前使用的操作系…...

编程日记 2025/8/18 3:06:51

智能图像处理平台：图片管理

接着我们讲图片管理&#xff0c;先实现图片基础的增删改查&#xff0c;再去考虑图像处理。 主要是&#xff0c;我们需要完成查询时&#xff0c;查询的图片的上传者的角色等级小于等于我们当前登陆账号。 后端controller&#xff1a; package com.llpp.controller;import cn.…...

编程日记 2025/9/6 17:14:25

如何使用Docker一键本地化部署LibrePhotos搭建私有云相册

文章目录 前言1.关于LibrePhotos2.本地部署LibrePhotos3.LibrePhotos简单使用4. 安装内网穿透5.配置LibrePhotos公网地址6. 配置固定公网地址 前言 你是不是也经常对着手机里那一堆珍贵的照片发愁&#xff0c;心里想着&#xff1a;‘这要是被谁偷偷看了可咋办&#xff1f;’别…...

编程日记 2025/9/8 1:12:38

删除idea recent projects 记录

1、退出idea&#xff08;一定要全部退出idea&#xff0c;要不然删除后&#xff0c;idea一退出&#xff0c;又保存上了&#xff09; 2、进入 C:\Users\Administrator\AppData\Roaming\JetBrains\IntelliJIdea2024.1\options 目录 根据不同的版本号 IntelliJIdea2024.1 这个地方…...

编程日记 2025/9/8 8:54:52

基因组突变数据分析-ClinVar数据库

探序基因肿瘤研究院 数据库简介&#xff1a;ClinVar是一个免费访问的公共数据库&#xff0c;记录了人类变异和表型之间的关系&#xff0c;并提供了支持性证据&#xff08;supporting evidence&#xff09;。ClinVar提供的变异临床意义&#xff08;clinical significance&#…...

编程日记 2025/9/6 4:21:32

windows 下 使用Python OpenCV针对 压缩的tiff 图像进行解压缩 并转换成多张jpeg 图像

文章大纲 Tif/Tiff 图像简介tif 后缀的文件中为什么可以嵌入多张图片Tif 图像 与 jpg 图像转换的要点参考使用的 GitHub 仓库链接tifffile 库的功能与其他库的区别代码实现 基于 tifffile参考文献Tif/Tiff 图像简介 TIFF（Tagged Image File Format）是一种灵活且可适应的文件…...

编程日记 2025/9/5 0:11:18

小皮网站搭建

前提&#xff1a;小皮的安装下载 1、在www目录下创建一个新的文件夹&#xff0c;用来存放网站源码&#xff1b; 2、安装数据库管理工具phpMyadmin 3、新建数据表 添加字段 4、创建网站 5、前端的登录代码 注册 后端php 网页展示 登录成功跳转welcome.php...

编程日记 2025/9/7 19:09:37

Java8面试

Java 8 有哪些新特性? &#x1f40e;Java 8五大神装特性&#x1f40e; Lambda表达式&#xff08;魔法调料&#xff09; 曼波觉得像速食魔法咒语&#xff01;(๑✧◡✧๑) // 传统写法&#xff08;像冗长菜谱&#xff09; new Thread(new Runnable() {public void run() {Syst…...

编程日记 2025/9/4 11:33:14

一个基于C# Winform开源免费的通用快速开发框架，内置完整的权限架构！

前言 今天大姚给大家分享一个基于C# Winform开源免费&#xff08;GPL-2.0开源协议&#xff09;的通用快速开发框架&#xff0c;内置完整的权限架构&#xff1a;WinformDevFramework。 项目介绍 WinformDevFramework是一个基于C# Winform开源免费&#xff08;GPL-2.0开源协议…...

编程日记 2025/9/10 1:09:52

2025年度福建省职业院校技能大赛高职组“信息安全管理与评估”赛项规程样题模块二

模块二 网络安全事件响应、数字取证调查、应用程序安全 竞赛项目赛题 本文件为信息安全管理与评估项目竞赛-第二阶段样题&#xff0c;内容包括&#xff1a;网络安全事件响应、数字取证调查。 本次比赛时间为90分钟。 介绍 竞赛有固定的开始和结束时间&#xff0c;参赛队伍必须…...

编程日记 2025/9/6 18:12:51

【朝夕教育】《鸿蒙原生应用开发从零基础到多实战》005-TypeScript 中的枚举

标题详情作者简介愚公搬代码头衔华为云特约编辑&#xff0c;华为云云享专家&#xff0c;华为开发者专家&#xff0c;华为产品云测专家&#xff0c;CSDN博客专家&#xff0c;CSDN商业化专家&#xff0c;阿里云专家博主&#xff0c;阿里云签约作者&#xff0c;腾讯云优秀博主&…...

编程日记 2025/9/9 1:12:03

使用create_sql_query_chain工具根据自然语言问题生成SQL查询，踩坑版

1. 开启调试模式 from langchain import debugdebug True # 启用调试模式说明&#xff1a; 这里从 langchain 库中导入了一个名为 debug 的变量&#xff08;或模块&#xff09;&#xff0c;然后将它设置为 True。这通常用来启用调试模式&#xff0c;方便开发者在程序运行时看…...

编程日记 2025/9/10 8:02:10

DeepSeek本地部署+自主开发对话Web应用

文章目录 引言前端部分核心页面DeepSeek.vueMyModal.vue 后端部分WebSocketConfig 配置类AbstractDeepSeekToolDeepSeekWebSocketHandler 数据库设计总结 引言 最近DeepSeep横空出世&#xff0c;在全球内掀起一股热潮&#xff0c;到处都是满血大模型接入的应用&#xff0c;但这…...

编程日记 2025/9/10 15:17:18

【Springboot】解决问题 o.s.web.servlet.PageNotFound : No mapping for *

使用 cursor 进行老项目更新为 springboot 的 web 项目&#xff0c;发生了奇怪的问题&#xff0c;就是 html 文件访问正常&#xff0c;但是静态文件就是 404 检查了各种配置&#xff0c;各种比较&#xff0c;各种调试&#xff0c;最后放弃时候&#xff0c;清理没用的配置文件&…...

编程日记 2025/9/10 8:51:29

微信小程序点击按钮，将图片下载到本地

前言&#xff1a; 最近在公司完成一个小程序的时候需要实现一个功能&#xff1a;点击按钮获取用户相册权限&#xff0c;将图片下载到用户本地相册&#xff0c;经过了好几次的尝试最终算是实现了。将总结的经验在这里分享给小伙伴们。 实现方式&#xff1a; //.wxml文件 <…...

编程日记 2025/9/10 10:56:27

解锁网络防御新思维：D3FEND 五大策略如何对抗 ATTCK

D3FEND 简介 背景介绍 2021年6月22日&#xff08;美国时间&#xff09;&#xff0c;美国MITRE公司正式发布了D3FEND——一个网络安全对策知识图谱。该项目由美国国家安全局&#xff08;NSA&#xff09;资助&#xff0c;并由MITRE的国家安全工程中心&#xff08;NSEC&#xff…...

编程日记 2025/9/9 2:18:26

架构案例：从初创互联网公司到分布式存储与反应式编程框架的架构设计

文章目录 引言一、初创互联网公司架构演化案例1. 万级日订单级别架构2. 十万级日订单级别架构3. 百万级日订单级别架构 二、分布式存储系统 Doris 架构案例三、反应式编程框架架构案例总结 引言 分布式架构 今天我们将探讨三种不同类型的架构案例&#xff0c;分别探讨 一个初…...

编程日记 2025/9/5 10:57:04

Redis数据结构-List列表

1.List列表 列表类型适用于存储多个有序的字符串&#xff08;这里的有序指的是强调数据排列顺序的重要&#xff0c;不是升序降序的意思&#xff09;&#xff0c;列表中的每个字符串称为元素&#xff08;element&#xff09;&#xff0c;一个列表最多可以存储2^32-1个元素。在R…...

编程日记 2025/9/6 0:16:24

开启AI短剧新纪元!SkyReels-V1/A1双剑合璧!昆仑万维开源首个面向AI短剧的视频生成模型

论文链接&#xff1a;https://arxiv.org/abs/2502.10841 项目链接&#xff1a;https://skyworkai.github.io/skyreels-a1.github.io/ Demo链接&#xff1a;https://www.skyreels.ai/ 开源地址&#xff1a;https://github.com/SkyworkAI/SkyReels-A1 https://github.com/Skywork…...

编程日记 2025/9/5 21:01:49

mac安装环境

minconda https://docs.anaconda.net.cn/miniconda/install/ 注意在下载下来应该有100多兆&#xff0c;太大了应该是完整版&#xff0c;我们不需要 jdk 镜像网站下载设置环境变量&#xff1a; 终端&#xff1a;sudo vim ~/.zshrc # JDK Config JAVA_HOME/Library/Java/Java…...

编程日记 2025/9/5 15:28:16

js加密之延伸requestAnimationFrame

简言 上篇文章有提到requestAnimationFrame,只是随笔带过。这篇文章就着重研究一下requestAnimationFrame的运用&#xff0c;以及实际作用。还有关于在js加密技术中的落地实现可行性。 功能说明 小声说一下,做开发的同学一定要学会翻官方文档,我这里直接引用一段官方介绍。 …...

编程日记 2025/9/10 1:41:06

SpringBoot @Value 注解使用

Value 注解用于将配置文件中的属性值注入到Spring管理的Bean中。 1. 基本用法 Value 可以直接注入配置文件中的属性值。 配置文件 (application.properties 或 application.yml) 配置文件定义需要注入的数据。 consumer:username: lisiage: 23hobby: sing,read,sleepsubje…...

编程日记 2025/9/6 13:31:56

JavaFunction的使用

一、基础概念与核心方法 ​定义与作用​ Function<T, R> 是一个函数式接口&#xff0c;接收类型为 T 的输入参数&#xff0c;返回类型为 R 的结果。其核心方法为 apply(T t)。例如&#xff0c;将字符串转换为整数长度&#xff1a; java Function<String, Integer>…...

编程日记 2025/9/8 11:49:39

TVbox蜂蜜影视：智能电视观影新选择，简洁界面与强大功能兼具

蜂蜜影视是一款基于猫影视开源项目 CatVodTVJarLoader 开发的智能电视软件&#xff0c;专为追求简洁与高效观影体验的用户设计。该软件从零开始编写&#xff0c;界面清爽&#xff0c;操作流畅&#xff0c;特别适合在智能电视上使用。其最大的亮点在于能够自动跳过失效的播放地址…...

编程日记 2025/9/4 11:50:06

Python基于交互注意力的深度时空网络融合多源信息的剩余寿命预测方法

基于交互注意力的深度时空网络融合多源信息的剩余寿命预测方法 一、方法框架设计 本方法的核心思想是通过交互注意力机制动态捕捉多源数据间的跨模态关联&#xff0c;并结合深度时空网络建模序列的时空退化特征。 1. 多源特征编码器 输入&#xff1a;传感器数据、工况参数、…...

编程日记 2025/9/4 17:45:18

阿里云 | 快速在网站上增加一个AI助手

创建智能体应用 如上所示&#xff0c;登录阿里云百炼人工智能业务控制台&#xff0c;创建智能体应用&#xff0c;智能体应用是一个agent&#xff0c;即提供个人或者企业的代理或中间件组件应用&#xff0c;对接阿里云大模型公共平台&#xff0c;为个人或者企业用户提供大模型应…...

编程日记 2025/9/6 21:57:18

基于Electron的应用程序安全测试基础 — 提取和分析.asar文件的案例研究

目录&#xff1a; 4.4. 案例研究 4.4.2. 情况描述 4.4.3. 信息收集 4.4.3.2. 检查隐藏目录&#xff08;点目录&#xff09;的可能性 4.4.3.3. 使用 DB Browser for SQLite 打开 .db 文件 4.4.3.4. 寻找加密算法 4.4.3.5. 找到加密算法 4.4.3.6. 理解加密流程 4.4.3.7. 找到“Ke…...

编程日记 2025/9/9 0:22:32

Vue3生命周期以及与Vue2的区别

文章目录 一、Vue3生命周期核心阶段与钩子函数二、Vue3生命周期示例&#xff1a;选项式 vs 组合式 API选项式 API 示例&#xff08;Vue2&#xff09;组合式 API 示例&#xff08;Vue3&#xff09; 三、Vue3与Vue2生命周期的核心差异1. 钩子函数更名2. 组合式 API 的影响3. 新增…...

编程日记 2025/9/9 1:49:04

windows下安装CUDA-本地微调大模型

1、查看NVIDIA的控制面板的版本号 2 下载CUDA Toolkit https://developer.nvidia.com/cuda-toolkit-archive 这里要下载和自己电脑NVIDIA适配CUDA的大版本要保持一致 选择对应的版本进行下载 文件比较大&#xff0c;直接右键复制链接&#xff0c;放到迅雷中两分钟就下好了 3 …...

编程日记 2025/9/8 9:00:28

LeetCode：132. 分割回文串 II（DP Java）

目录 132. 分割回文串 II 题目描述&#xff1a; 实现代码与解析&#xff1a; DP 原理思路&#xff1a; 132. 分割回文串 II 题目描述&#xff1a; 给你一个字符串 s&#xff0c;请你将 s 分割成一些子串&#xff0c;使每个子串都是回文串。 返回符合要求的 最少分割次数…...

编程日记 2025/9/9 13:44:10

C# 13与.NET 9革新及工业开发应用

摘要 微软推出的C# 13与.NET 9以“高效且智能”为导向&#xff0c;具备扩展类型、半自动属性、锁对象优化等十大革新。本文深入剖析新特性于工业级开发的应用场景&#xff0c;包含性能优化策略、AI集成方案以及EF Core实战技巧&#xff0c;为开发者提供从理论到实践的完整指引…...

编程日记 2025/9/1 21:29:21

IPoIB源码深度解析：如何基于TCP/IP协议栈实现高性能InfiniBand通信

一、IPoIB的核心设计理念 IPoIB（IP over InfiniBand）是一种在InfiniBand网络上承载IP流量的技术，其核心目标是在不修改上层应用的前提下，利用InfiniBand的高带宽和低延迟特性。与自定义协议栈不同，IPoIB通过深度集成到Linux内核TCP/IP协议栈中，将InfiniBand设备抽象为标…...

编程日记 2025/9/5 18:57:18

《白帽子讲 Web 安全：点击劫持》

目录 摘要&#xff1a; 一、点击劫持概述 二、点击劫持的实现示例&#xff1a;诱导用户收藏指定淘宝商品 案例 构建恶意页面&#xff1a; 设置绝对定位和z - index&#xff1a; 控制透明度&#xff1a; 三、其他相关攻击技术 3.1图片覆盖攻击与 XSIO 3.2拖拽劫持与数据…...

编程日记 2025/9/6 20:10:25

PostgreSQL10 逻辑复制实战：构建高可用数据同步架构！

PostgreSQL10 逻辑复制实战&#xff1a;打造高可用数据同步架构&#xff01; 概述 PostgreSQL 10 引入了逻辑复制&#xff08;Logical Replication&#xff09;&#xff0c;为数据库高可用和数据同步提供了更灵活的选择。PostgreSQL 复制机制主要分为物理复制和逻辑复制两种&…...

编程日记 2025/9/6 8:03:46

Spring Boot 异步编程深入剖析

Spring Boot 异步编程深入剖析 1. 异步方法的使用 原理深度解析 Spring Boot 的异步方法基于 Spring 的 AOP&#xff08;面向切面编程&#xff09;实现。当在方法上添加 Async 注解时&#xff0c;Spring 会为该方法所在的类创建一个代理对象。当调用该异步方法时&#xff0c…...

编程日记 2025/9/10 8:42:50

《动手学习深度学习》的笔记，将会持续更新。

1.什么是机器学习？ 机器学习是：换句话说，我们用数据训练（train）模型。 数据不断的训练出比较好的模型。 1.2 机器学习的关键零件 1.学习的数据。 2. 如何转换数据的模型。 3.一个目标函数。 4.调整模型参数以优化目标函数的算法。 1，数据有什么组成？ 数据=样本+…...

编程日记 2025/9/10 7:01:46

[STM32]从零开始的STM32 BSRR、BRR、ODR寄存器讲解

一、前言 学习STM32一阵子以后&#xff0c;相信大家对STM32 GPIO的控制也有一定的了解了。之前在STM32 LED的教程中也教了大家如何使用寄存器以及库函数控制STM32的引脚从而点亮一个LED&#xff0c;之前的寄存器只是作为一个引入&#xff0c;并没有深层次的讲解&#xff0c;在教…...

编程日记 2025/9/7 22:53:02

VUE3+Vite使用TailwindCSS【若依前后端分离框架】

参考&#xff1a;https://tailwind.nodejs.cn/docs/guides/vite#vue 和 https://blog.csdn.net/hjl_and_djj/article/details/144694485依次运行命令&#xff1a; cnpm install -D tailwindcss3.4.17 postcss autoprefixernpx tailwindcss init -p修改配置文件tailwind.config.…...

编程日记 2025/9/9 21:21:37

【Linux文件IO】系统IO详情

目录 一、前言 二、相关API介绍 2.1 open 2.2 read 2.3 write 2.4 lseek 2.5 close 三、简单示例 3.1 示例1 3.2 示例2 一、前言 在 Linux 系统编程中&#xff0c;系统 I/O&#xff08;又称低级 I/O&#xff09;是直接通过操作系统提供的系统调用实现的文件操作接口…...

编程日记 2025/9/7 7:17:02

【弹性计算】弹性裸金属服务器和神龙虚拟化（三）：弹性裸金属技术

弹性裸金属服务器和神龙虚拟化&#xff08;三&#xff09;&#xff1a;弹性裸金属技术 1.弹性裸金属技术背景1.1 传统 KVM 虚拟化系统导致 CPU 计算特性损失1.2 传统 KVM 虚拟化系统导致资源争抢不可避免1.3 传统 KVM 虚拟化系统导致 I/O 性能瓶颈 2.弹性裸金属技术实现2.1 VPC…...

编程日记 2025/9/8 12:11:29

(贪心 合并区间）leetcode 56

思路来源&#xff1a;代码随想录--代码随想录_合并区间题解 首先用lambda 按照左界值升序排序 建立答案的二维数组&#xff0c;将第一个行区间放入&#xff0c;判断从第二行开始 第i行的左区间一定大于第i-1行的左区间&#xff08;排序过了&#xff09;&#xff0c;所以只判断…...

编程日记 2025/9/7 17:32:51

如何理解语言模型

统计语言模型 先看语言模型&#xff0c;语言即自然语言&#xff0c;模型及我们要解决的某个任务。 任务一&#xff1a;判断哪句话出现的概率大 任务二&#xff1a;预判空缺的位置最有可能是哪个词 再看统计&#xff0c;统计即解决上述两个任务的解决方法。先对语句进行分词…...

编程日记 2025/9/9 18:18:20

动态规划/贪心算法

一、动态规划 动态规划 是一种用于解决优化问题的算法设计技术&#xff0c;尤其适用于具有重叠子问题和最优子结构性质的问题。它通过将复杂问题分解为更简单的子问题&#xff0c;并保存这些子问题的解以避免重复计算&#xff0c;从而提高效率。 动态规划的核心思想 最优子结…...

编程日记 2025/9/6 6:54:22

Hadoop简介

1. Hadoop简介 官网&#xff1a;http://hadoop.apache.org 1.1 Hadoop架构 Hadoop由三个模块组成&#xff1a;分布式存储HDFS、分布式计算MapReduce、资源调度引擎YARN 1.2 Hadoop历史 Hadoop作者Doug Cutting Apache Lucene是一个文本搜索系统库 Apache Nutch作为前者的一部…...

编程日记 2025/9/9 8:59:00

Vscode 便用快捷键设置教程

文章目录 简介&#xff1a;1. go to define (跳转到函数定义的位置)2. go to declaration (跳转到函数声明的位置)3. move line &#xff08;上下移动本行代码&#xff09;3.1上下复制本行代码 4. 前进和后退&#xff08;就是前进到光标上一次停留的位置&#xff0c;和后退到那…...

编程日记 2025/9/10 10:45:53

数据库（MySQL）：使用命令从零开始在Navicat创建一个数据库及其数据表（一）.创建基础表

一. 使用工具和命令 1.1 使用的工具 Navicat Premium 17 &#xff1a;“Navicat”是一套可创建多个连接的数据库管理工具。 MySQL版本8.0.39 。 1.2 使用的命令 Navicat中使用的命令 命令 命令解释 SHOW DATABASES&#xff1b; 展示所有的数据库 CREATE DATABASE 数据…...

编程日记 2025/9/6 14:41:33

水滴tabbar canvas实现思路

废话不多说之间看效果图，只要解决了这个效果水滴tabbar就能做出来了 源码地址 一、核心实现步骤分解 布局结构搭建 使用 作为绘制容器 设置 width=600, height=200 基础尺寸 通过 JS 动态计算实际尺寸（适配高清屏） function initCanvas() {// 获取设备像素比（解决 Re…...

编程日记 2025/9/1 7:07:33

windows安装vue

1、下载nodejs安装包 https://nodejs.cn/download/ 2、安装node 中途记得可以自己改安装路径&#xff0c;其他都是下一步 3、安装完成后检查 node -v &#xff1a;查看nodejs的版本 npm -v &#xff1a;查看npm的版本 4、修改npm默认安装目录与缓存日志目录的位置 在nodejs目…...

编程日记 2025/9/8 21:46:46

使用3090显卡部署Wan2.1生成视频

layout: post title: 使用3090显卡部署Wan2.1生成视频 catalog: true tag: [Kubernetes, GPU, AI] 使用3090显卡部署Wan2.1生成视频 1. 环境说明2. 模型下载3. 克隆仓库4. 安装依赖5. 生成视频 5.1. 使用generate脚本生成5.2. 使用gradio启动UI界面生成 5.2.1. 启动gradio服务5…...

编程日记 2025/9/10 0:40:18