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

前端基础技术全解析：从HTML前端基础标签语言开始，逐步深入CSS样式修饰、JavaScript脚本控制、Ajax异步通信以及WebSocket持久通信

news 来源：原创 2025/5/4 3:21:33

前言：

1.前端技术html简单了解：

1.1HTML代码是由标签构成的。

1.2.HTML 文件基本结构

1.3.HTML 常见标签

标题标签:

段落标签: p

文本格式化标签

图片标签：

超链接标签: a

测试代码：

展示效果：

表单标签（可以将前端数据传送到后端）

将前端数据传送到后端的测试代码：

效果：

2.css扫盲

2.1.基本语法规范：

2.2.测试代码：

2.3.效果展示

3.js扫盲

3.1.使用js给按钮添加点击事件

测试代码：

效果展示

3.2、使用js获取以及设置一个页面控件（普通的控件以及输入框）的内容

测试代码：

效果展示：

4.前端技术ajax简单了解

五子棋注册页面测试代码：

运行效果：

5.websocket

测试代码：

展示效果：

6.Ajax和websocket的关系：

6.1、定义与原理

6.2、通信方式与实时性

6.3、数据传输效率

6.4、应用场景

6.5.兼容性与关系

前言：

本文主要讲解了关于一些前端的基础知识，用来前端的扫盲，能够对于前端有一个大致的认识，不至于对前端如何运行，代码都一窍不通。下面是本文的主要讲解方向：

HTML:标签语言，渲染前端网页的语言
CSS:层看样式表，对html标签进行样式修饰，让页面控件更加好看
JS:脚本语言，在前端web这里控制页面的渲染
AJAX:异步的http客户端，向服务器发送http请求的
WebSocket:创建一个websocket请求，请求服务器建立websocket长连接，进行持久通信。

这里我们从0开始，一步一步了解前端的基础知识。

1.前端技术html简单了解：

1.1HTML代码是由标签构成的。

形如：

<body>hello</body>

标签名 (body) 放到<>中
大部分标签成对出现，<body>为开始标签，</body>为结束标签
少数标签只有开始标签,称为"单标签".
开始标签和结束标签之间,写的是标签的内容,(hello)
开始标签中可能会带有"属性".id 属性相当于给这个标签设置了一个唯一的标识符(身份证号码).

<body id="myId">hello</body>

1.2.HTML 文件基本结构

<html><head>
<title>第一个页面</title></head><body>
hello world</body>
</html>

html 标签是整个 html 文件的根标签(最顶层标签)
head 标签中写页面的属性.
body 标签中写的是页面上显示的内容
title 标签中写的是页面的标题.

1.3.HTML 常见标签

标题标签:

h1-h6 有六个, 从 h1 - h6. 数字越大, 则字体越小.

<h1>代表的是标题标签，后面数字越大，最后在界面上显示的字体大小就越小，呈反比。

<h1>hello</h1>
<h2>hello</h2>
<h3>hello</h3>
<h4>hello</h4>
<h5>hello</h5>
<h6>hello</h6>

段落标签: p

把一段比较长的文本粘贴到 html 中, 会发现并没有分成段落. 在html中使用标签括起一个段落进行换行。当然也可以在段落内使用<br/>标签进行换行操作。

例如以下文本:

<p>段落，
在html中一般的回车并不起作用，会被解释成为一个空格<br/>但是br不一样，br标签的作用就是换行。
</p>

效果如下：

文本格式化标签

加粗: strong 标签和 b 标签
倾斜: em 标签和 i 标签
删除线: del 标签和 s 标签下
划线: ins 标签和 u 标签

<p><b>比如b标签就是加粗</b></p>
<p><i>比如i标签就是斜体</i></p>
<p><s>比如s标签就是删除线</s></p>
<p><u>比如u就是下划线</u></p>

效果如下：

图片标签：

img 标签必须带有 src 属性. 表示图片的路径.

alt: 替换文本. 当文本不能正确显示的时候, 会显示一个替换的文字.
title: 提示文本. 鼠标放到图片上, 就会有提示.
width/height: 控制宽度高度. 高度和宽度一般改一个就行, 另外一个会等比例缩放. 否则就会图片失衡.
border: 边框, 参数是宽度的像素. 但是一般使用 CSS 来设定.

因为当前页面是在我的桌面文件里面的，而我采用的图片也是桌面上的，因此在同一路径下，直接./加图片名就可以加载了。

超链接标签: a

href: 必须具备, 表示点击后会跳转到哪个页面.
target: 打开方式. 默认是 _self. 如果是 _blank 则用新的标签页打开.

这里我们根据自己学到的知识，自己简单编写一个前端界面：

测试代码：

<html><head><meta charset="utf-8"><title>学习页面</title></head><body><h1>Hello World</h1><h2>Hello World</h2><img src='./1.jpg' width="300px"><a href="https://www.baidu.com">这是一个链接，可以跳转到百度</a></body>    
</html>

展示效果：

点开链接之后，就直接从当前页面跳转到百度，因为没有设置target打开方式，默认就是从当前页面打开！

表单标签（可以将前端数据传送到后端）

表单是让用户输入信息的重要途径. 分成两个部分:

表单域: 包含表单元素的区域. 重点是 form 标签.
表单控件: 输入框 , 提交按钮等. 重点是 input 标签.

<input type="text" placeholder="input标签默认是文本框"> <br/> 
<input type="password" placeholder="type属性为password是密码框"> <br/> 
<input type="radio" name="sex">type属性为radio是单选框,name属性相同则默认为同一组-男 <br/> 
<input type="radio" name="sex" checked="checked">type属性为radio是单选框-女<br/> 
<input type="checkbox"> checkbox是复选框-吃饭 <br/> 
<input type="checkbox"> checkbox是复选框-睡觉 <br/> 
<input type="checkbox"> checkbox是复选框-打游戏<br/> 
<input type="checkbox" id="testid"> 
<label for="testid">label标签for属性与对应的输入框id对应起来，这时候点击文字也能选中</label><br/> 
<input type="button" value="button是普通按钮" onclick="alert('alert是提示框调用函数')"><br/> 
<input type="submit" value="submit是提交按钮">点击这里就会向服务器提交表单域中的表单数据<br/> 
<input type="file" value="file是文件选择按钮框"><br/> 
<input type="reset" value="reset是清空按钮，会清空表单域的所有数据"><br>

将前端数据传送到后端的测试代码：

<html><head><meta charset="utf-8"><title>学习页面</title></head><body><h1>Hello World</h1><h2>Hello World</h2><img src='./1.jpg' width="300px"><a href="https://www.baidu.com">这是一个链接，可以跳转到百度</a><form action="http://123.249.125.60:8085/login"method="post"><input type="text" name="uesrname"><input type="password" name="password"><input type="submit" name="submit" value="提交"></form></body>    
</html>

效果：

我们通过这个模块，就可以将前端输入的数据传送到指定的服务器上了！

这样body就可以提取我们在前端界面输入的信息了！

2.css扫盲

CSS 能够对网页中元素位置的排版进行像素级精确控制, 实现美化页面的效果. 能够做到页面的样式和结构分离。

CSS 就是 "东方四大邪术" 之化妆术.

2.1.基本语法规范：

选择器 + { 一条 / N 条声明 }

选择器决定针对谁修改 ( 找谁 )
声明决定修改啥. ( 干啥 )
声明的属性是键值对. 使用 ; 区分键值对 , 使用 : 区分键和值.

2.2.测试代码：

<html><head><meta charset="utf-8"><title>学习页面</title><style>h1 {color: red;font-size: 20px;}</style></head><body><h1>Hello World</h1><h2>Hello World</h2><img src='./1.jpg' width="300px"><a href="https://www.baidu.com">这是一个链接，可以跳转到百度</a><form action="http://123.249.125.60:8085/login"method="post"><input type="text" name="uesrname"><input type="password" name="password"><input type="submit" name="submit" value="提交"></form></body>    
</html>

2.3.效果展示

3.js扫盲

3.1.使用js给按钮添加点击事件

测试代码：

<html><head><meta charset="utf-8"><title>学习页面</title><style>h1 {color: red;font-size: 20px;}</style></head><body><h1>Hello World</h1><h2 id="h2_title">Hello World</h2><img src='./1.jpg' width="300px"><a href="https://www.baidu.com">这是一个链接，可以跳转到百度</a><form action="http://123.249.125.60:8085/login"method="post"><input type="text" name="uesrname"><input type="password" name="password"><input type="submit" name="submit" value="提交"></form><button onclick="test()"> 普通的button </button></body>    <script>function test(){//alert("你好！！！");var h2 = document.getElementById("h2_title");alert(h2.innerHTML);h2.innerHTML = "Hello Kehan!"}</script>
</html>

效果展示

点击确定按钮之后，就会更改我们所设定的内容。

3.2、使用js获取以及设置一个页面控件（普通的控件以及输入框）的内容

我们通过输入输入框的数据，并点击确认按钮，来获取输入框里面的内容。

测试代码：

<html><head><meta charset="utf-8"><title>学习页面</title><style>h1 {color: red;font-size: 20px;}</style></head><body><h1>Hello World</h1><h2 id="h2_title">Hello World</h2><img src='./1.jpg' width="300px"><a href="https://www.baidu.com">这是一个链接，可以跳转到百度</a><form action="http://123.249.125.60:8085/login"method="post"><input type="text" id="uesrname" name="uesrname"><input type="password" name="password"><input type="submit" name="submit" value="提交"></form><button onclick="test()"> 普通的button </button></body>    <script>function test(){//alert("你好！！！");//var h2 = document.getElementById("h2_title");//alert(h2.innerHTML);//h2.innerHTML = "Hello Kehan!"var input = document.getElementById("uesrname");alert(input.value);input.value = "";}</script>
</html>

效果展示：

4.前端技术ajax简单了解

注意我们这里的Ajax的使用使用的是jequery的Ajax，这一版本的Ajax更方便使用。

这里我们使用五子棋注册页面为例。

通过ajax向后台发送用户注册请求
如果请求失败，则清空两个输入框内容，并提示错误原因；
如果请求成功，则跳转到登录页面

五子棋注册页面测试代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>注册</title><link rel="stylesheet" href="./css/common.css"><link rel="stylesheet" href="./css/login.css">
</head>
<body><div class="nav">网络五子棋对战游戏</div><div class="login-container"><!-- 登录界面的对话框 --><div class="login-dialog"><!-- 提示信息 --><h3>注册</h3><!-- 这个表示一行 --><div class="row"><span>用户名</span><input type="text" id="user_name" name="username"></div><!-- 这是另一行 --><div class="row"><span>密码</span><input type="password" id="password" name="password"></div><!-- 提交按钮 --><div class="row"><!-- 1. 给按钮添加点击事件，调用注册函数 --><button id="submit" onclick="reg()">提交</button></div></div></div> <script src="js/jquery.min.js"></script><script>//1. 给按钮添加点击事件，调用注册函数//2. 封装实现注册函数function reg() {//  1. 获取两个输入框空间中的数据，组织成为一个json串var reg_info = {username: document.getElementById("user_name").value,password: document.getElementById("password").value};console.log(JSON.stringify(reg_info));//  2. 通过ajax向后台发送用户注册请求$.ajax({url : "/reg",type : "post",data : JSON.stringify(reg_info),success : function(res) {if (res.result == false) {//  4. 如果请求失败，则清空两个输入框内容，并提示错误原因document.getElementById("user_name").value = "";document.getElementById("password").value = "";alert(res.reason);}else {//  3. 如果请求成功，则跳转到登录页面alert(res.reason);window.location.assign("/login.html");}},error : function(xhr) {document.getElementById("user_name").value = "";document.getElementById("password").value = "";alert(JSON.stringify(xhr));}})}</script>
</body>
</html>

运行效果：

注册用户成功，并成功跳转到登录界面。

5.websocket

简单使用用例：

在index.html中创建一个websocket通信，从输入框中获取数据发送给服务器，得到响应后，展示在页面中

测试代码：

<html><head><meta charset="utf-8"><title>学习页面</title><style>h1 {color: red;font-size: 20px;}</style></head><body><h1>Hello World</h1><h2 id="h2_title">Hello World</h2><img src='./1.jpg' width="300px"><a href="https://www.baidu.com">这是一个链接，可以跳转到百度</a><form action="http://123.249.125.60:8085/login"method="post"><input type="text" id="uesrname" name="uesrname"><input type="password" name="password"><input type="submit" name="submit" value="提交"></form><button onclick="test()"> 普通的button </button></body>    <script>var ws = new WebSocket("ws://123.249.125.60:8085/ws");ws.onopen = function(){alert("ws 握手成功");}ws.onerror = function(){alert("ws 通信错误");}ws.onclose = function(){alert("ws 链接断开");}ws.onmessage = function(evt){//alert(evt.data);var h2 = document.getElementById("h2_title");h2.innerHTML = evt.data;}function test(){ws.send(document.getElementById("uesrname").value);document.getElementById("uesrname").value = "";//alert("你好！！！");//var h2 = document.getElementById("h2_title");//alert(h2.innerHTML);//h2.innerHTML = "Hello Kehan!"/*var input = document.getElementById("uesrname");alert(input.value);input.value = "";*/}</script>
</html>

展示效果：

6.Ajax和websocket的关系：

6.1、定义与原理

Ajax：
- 全称：Asynchronous JavaScript and XML。
- 原理：Ajax是一种在不刷新整个页面的情况下，通过JavaScript异步向服务器发送HTTP请求并获取数据的技术。它使用XMLHttpRequest对象在后台与服务器进行通信，从而实现了页面的局部刷新。
WebSocket：
- 原理：WebSocket是一种在单个TCP连接上进行全双工通信的协议。它允许服务器和客户端之间建立一个持久的连接，通过这个连接，双方可以随时相互发送数据。WebSocket通信是通过HTTP/1.1协议的101状态码进行握手后建立的。

6.2、通信方式与实时性

Ajax：
- Ajax的通信方式是基于HTTP协议的短连接。每次请求完成后，连接即会关闭。当客户端需要再次发送请求时，必须重新建立连接。这种方式导致了一定的延迟和性能开销，实时性相对较差。
WebSocket：
- WebSocket建立了持久连接，数据可以即时地在客户端和服务器之间传递，因此具有非常高的实时性。它特别适合于需要实时更新数据的应用场景，如在线游戏、实时聊天等。

6.3、数据传输效率

Ajax：
- Ajax通常使用文本格式（如XML或JSON）来传输数据。由于每次请求都需要重新建立连接，并且数据以文本形式传输，这会导致数据量相对较大，传输效率较低。
WebSocket：
- WebSocket采用了二进制帧的格式来传输数据，可以更有效地利用网络带宽。同时，由于连接的持久性，减少了连接建立和关闭的开销，进一步提高了数据传输的效率，所以传输效率相较更高。

6.4、应用场景

Ajax：
- Ajax广泛应用于各种需要异步获取数据的场景，如网页的局部刷新、表单验证、数据查询和加载等。它能够在不刷新整个页面的情况下，为用户提供更加流畅的交互体验。
WebSocket：
- WebSocket适用于对实时性要求较高的场景，如多人在线游戏中的实时交互、金融市场的实时行情推送等。在这些场景中，WebSocket能够提供低延迟、高效率的双向通信。

6.5.兼容性与关系

兼容性：
- Ajax作为一种较为成熟的技术，具有广泛的兼容性。几乎所有的现代浏览器都支持Ajax请求。
- WebSocket的兼容性也相对较好，现代主流的浏览器都对WebSocket提供了良好的支持。但在一些较老的浏览器版本中可能存在兼容性问题。
关系：
- 虽然Ajax和WebSocket在通信原理、实时性、数据传输效率和应用场景等方面存在明显的区别，但它们都是Web开发中用于实现客户端与服务器之间通信的技术。
- 在某些情况下，Ajax和WebSocket可以结合使用。例如，在初始化阶段可以使用Ajax来加载页面所需的部分数据或配置信息，而在需要实时交互的场景中则使用WebSocket来实现低延迟的双向通信。

综上所述，Ajax和WebSocket各有优劣，开发者在实际开发中应根据具体的应用需求来选择合适的技术以实现最佳的用户体验和系统性能。

前端基础技术全解析：从HTML前端基础标签语言开始，逐步深入CSS样式修饰、JavaScript脚本控制、Ajax异步通信以及WebSocket持久通信

目录前言： 1.前端技术html简单了解： 1.1HTML代码是由标签构成的。 1.2.HTML 文件基本结构 1.3.HTML 常见标签标题标签: 段落标签: p 文本格式化标签图片标签： 超链接标签: a 测试代码： 展示效果： 表单…...

编程日记 2025/5/4 3:21:33

试用kotlin multiplatform

目录多平台框架简介示例工程建立与运行常用库桌面平台遇到的一些问题使用总结多平台框架简介多平台的框架不少,flutter,rust,每一个都是优点明显,缺点也明显. flutter的桌面端控件少,质量不一.dart语言丑陋又慢.我不喜欢它. rust,桌面gui不成熟,成熟一些的slint…...

编程日记 2025/4/29 11:04:34

Scratch023-（沙漠变绿洲）

提示： 知识回顾： 1、画笔的各个属性 2、“将笔的颜色设为”积木 3、“将笔的颜色增加”积木文章目录前言一、案例展示二、功能分析三、步骤拆解1.背景角色和画笔的初始化（1）初始化画笔2、一起绘制一个小雨滴3、绘制多个随机的小…...

编程日记 2025/5/4 2:53:28

【Linux】深入理解文件系统(超详细)

目录一.磁盘 1-1 磁盘、服务器、机柜、机房 📌补充： 📌通常网络中用高低电平，磁盘中用磁化方向来表示。以下是具体说明： 📌如果有一块磁盘要进行销毁该怎么办？ 1-2 磁盘存储结构编辑…...

编程日记 2025/4/30 2:29:41

基于 Apache Commons Pool 实现的 gRPC 连接池管理类 GrpcChannelPool 性能分析与优化

基于 Apache Commons Pool 实现的 gRPC 连接池管理类 GrpcChannelPool 性能分析与优化 1. 输出关键信息的代码示例日志记录方法使用以下代码记录连接池的关键信息，帮助分析连接池的状态和性能瓶颈： import org.apache.commons.pool2.impl.GenericO…...

编程日记 2025/5/4 1:57:23

文章目录 1. 官方文档教程2. 注册实现3. 登录实现4. 关于作者其它项目视频教程介绍 1. 官方文档教程 https://developers.weixin.qq.com/miniprogram/dev/framework/路由跳转的几种方式： https://developers.weixin.qq.com/miniprogram/dev/api/route/wx.switchTab…...

编程日记 2025/5/4 2:51:37

网络安全-kail linux 网络配置（基础篇）

一、网络配置 1.查看网络IP地址， 我的kail：192.168.15.128 使用ifconfig查看kail网络连接情况，ip地址情况又复制了一台kail计算机的IP地址。再看一下windows本机：使用ipconfig进行查看： 再看一下虚拟机上的win7I…...

编程日记 2025/5/3 13:17:21

Lua语言的软件工程

Lua语言的软件工程引言在软件工程领域，编程语言的选择对项目的成功与否有着至关重要的影响。Lua语言作为一种轻量级、高效、可扩展的脚本语言，近年来在游戏开发、嵌入式系统以及其他高性能应用程序中得到了广泛应用。本文将深入探讨Lua语言的特点、优…...

编程日记 2025/5/2 16:56:12

【Rust自学】11.4. 用should_panic检查恐慌

喜欢的话别忘了点赞、收藏加关注哦（加关注即可阅读全文），对接下来的教程有兴趣的可以关注专栏。谢谢喵！(･ω･) 11.4.1. 验证错误处理的情况测试函数出了验证代码的返回值是否正确，还需要验证…...

编程日记 2025/5/3 14:54:16

基于深度模型的印章检测（c++）

效果展示： 有点： （1）快速（几十毫秒级别）； （2）精度高； int main() {std::string imagePath;// 提示用户输入图像路径std::cout << "请输入图像路…...

编程日记 2025/4/30 20:23:30

C#Struct堆栈

Struct若其内部含有堆对象，Struct的该对象放在堆上； Struct当做参数传递时，其堆属性作为引用传递，值属性还是作为值传递； struct TS { public int[] t1; public int t2; } public void TF1(TS t) { int[] t1 t.t1; …...

编程日记 2025/4/29 22:44:35

STM32之一种双通路CAN总线消息备份冗余处理方法（十三）

STM32F407 系列文章 - Dual-CANBus-ProMethod（十三） 目录前言一、现状分析二、解决思路 1.应用场景网络结构图 2.数据发送流程 3.数据接收流程 4.用到的模块 1.CAN网络速率及时间片分配 2.CAN网络消息ID组成 3.设备节点定义 4.数据格式说明…...

编程日记 2025/4/27 17:24:27

深入学习RabbitMQ的Direct Exchange（直连交换机）

RabbitMQ作为一种高性能的消息中间件，在分布式系统中扮演着重要角色。它提供了多种消息传递模式，其中Direct Exchange（直连交换机）是最基础且常用的一种。本文将深入介绍Direct Exchange的原理、应用场景、配置方法以及实践案例&a…...

编程日记 2025/5/1 4:07:38

客户端 ORA-12537: TNS: 连接已关闭

现象： 1、双节点数据库. 2、客户端连接 db1 正常 3、客户端连接db2 显示：ORA-12537: TNS: 连接已关闭 4、数据库正常启动 5、lsnrctl status 检查监听正常 6、lsnrctl stop/start 重启监听正常过程： 冲浪查看网友的解决方法。连接&…...

编程日记 2025/5/4 3:20:42

.net开发环境安装配置以及程序发布详细教程

文章目录一、安装visual studio1.1推荐win10操作系统1.2推荐vs20221.3选择工作负载二、新建基于.net的winform应用程序2.1为什么要.net 2.22.2.1 选择Window窗体应用三、发布.net应用一、安装visual studio 1.1推荐win10操作系统 1.2推荐vs2022 社区版、专业版、企业版都…...

编程日记 2025/4/23 14:24:59

盛最多水的容器

一、题目给定一个长度为n的整数数组height。有n条垂线，第i条线的两个端点是(i, 0)和(i, height[i])。找出其中的两条线，使得它们与x轴共同构成的容器可以容纳最多的水。返回容器可以储存的最大水量。也就是求x轴与y轴的面积。说明：你不能倾…...

编程日记 2025/5/3 12:50:25

spring boot解决swagger中的v2/api-docs泄露漏洞

在配置文件中添加以下配置 #解决/v2/api-docs泄露漏洞 springfox:documentation:swagger-ui:enabled: falseauto-startup: false 处理前： 处理后：...

编程日记 2025/4/25 8:32:36

MySQL和Hive中的行转列、列转行

水善利万物而不争，处众人之所恶，故几于道💦 文章目录 MySQL1.行转列2.列转行 Hive1.行转列2.列转行(1)侧窗(2)union MySQL 1.行转列把多行转成列。直接group，sum(if()) 2.列转行 Hive 1.行转列 select name,sum(if(kmshuxu…...

编程日记 2025/4/29 2:16:28

【关于 vite 使用plugin-legacy兼容低版本浏览器仍出现的问题的情况】

项目使用了vitevue3ts的方案，采用plugin-legacybabel适配低版本浏览器在开发工作中，项目使用了vitevue3ts的方案，但是需要适配低版本浏览器。首先使用了vitejs/plugin-legacy插件，配置完成后发现并不能解决问题， 出现…...

编程日记 2025/4/25 20:31:50

【集成学习】Bagging算法详解及代码实现

文章目录 1. Bagging集成学习算法1.1 简介1.2 基本步骤1.3 Bagging优缺点1.4 随机森林：Bagging的一个重要应用1.5 总结 2. Python代码实现3. 如何理解偏差与方差3.1 偏差（Bias）3.2 方差（Variance）3.3 方差与偏差的权衡…...

编程日记 2025/5/2 6:32:16

HTML5实现好看的中秋节网页源码

HTML5实现好看的中秋节网页源码前言一、设计来源1.1 网站首页界面1.2 登录注册界面1.3 节日由来界面1.4 节日习俗界面1.5 节日文化界面1.6 节日美食界面1.7 节日故事界面1.8 节日民谣界面1.9 联系我们界面二、效果和源码2.1 动态效果2.2 源代码源码下载结束语 HTML5实现好看…...

编程日记 2025/4/29 10:17:12

OBS Zoom to Mouse 脚本安装与使用指南

前言：OBS有两个不错的放大插件，经过多台电脑测试发现，唯一好用的就是下面介绍的obs-zoom-to-mouse.lua这个插件，因为它安装简单，不需要python，设置更人性化性价比极高。 zoom_and_follow_mouse.py 这个pyth…...

编程日记 2025/4/29 12:11:21

使用codeblock+wxwidgets做的界面，运行时额外出现了一个cmd窗口

如何不让cmd窗口出现？ 定位到Workspace project,选择菜单Project->Properties 将Type从Console application改为GUI application, 然后rebuild 这个project 之后再运行就没有cmd窗口了： 原因是在创建Project的时候选择了console mode application, 可…...

编程日记 2025/4/23 19:16:19

AI眼镜赛马，谁是C位，谁在边缘？

CES2025正在火热开展，智能眼镜成为最受关注的赛道之一。去年8月，Meta曾一枝独秀引领AI眼镜爆发了一次大行情，带动AI眼镜市场百花齐放，近几个月更是爆发新品潮。据悉，包括国内的雷神科技、恺英网络投资的乐相科技&a…...

编程日记 2025/5/1 13:53:26

Linux中彻底卸载Oracle 19.25单实例数据库

Linux中彻底卸载Oracle 19.25单实例数据库 1、关闭数据库实例2、关闭数据库监听3、执行deinstall卸载脚本4、删除相关目录5、删除数据库相关的用户和组 1、关闭数据库实例 su - oracle sqlplus / as sysdba shutdown immediate2、关闭数据库监听 su - oracle lsnrctl stop3、…...

编程日记 2025/4/23 22:56:36

分享:osgb倾斜数据转cesium-3dtiles 小工具.

背景: 很多知识殊途同归,在三维软件这块,少不了要和各种各样的数据格式打交道.osgb,stl,obj,3dtiles,3ds等等..虽然里面本质核心基本都是几何数据拓扑数据材质纹理数据等等,但是由于其组织方式不同和特殊的应用场景,导致很多模型需要转来转去...相信很多人在这方面都或多或少吃…...

编程日记 2025/4/30 12:03:39

基于单片机的客车载客状况自动检测系统（论文+源码）

1系统整体设计本课题为客车载客状况自动检测系统，在此以STM32单片机为核心控制器，结合压力传感器、红外传感器、蜂鸣器、语音提示模块、继电器、液晶等构成整个客车载客状况自动检测系统，整个系统架构如图2.1所示，在此通过两个红…...

编程日记 2025/4/30 6:47:07

Chrome访问https页面显示ERR_CERT_INVALID，且无法跳过继续访问

在访问网页的时候，因为浏览器自身的安全设置问题， 对于https的网页访问会出现安全隐私的提示， 甚至无法访问对应的网站，尤其是chrome浏览器， 因此本文主要讲解如何设置chrome浏览器的设置，来解决该问题&…...

编程日记 2025/4/29 13:09:16

中国省级产业结构高级化及合理化数据测算（2000-2023年）

一、数据介绍数据名称：中国省级产业结构高级化、泰尔指数数据年份：2000-2023年数据范围：31个省份数据来源：中国统计年鉴、国家统计局数据整理：内含原始版本、线性插值版本、ARIMA填补版本数据说明&#xf…...

编程日记 2025/5/4 2:33:21

云手机 —— 手机矩阵的 “超级外挂

如何打造手机矩阵打造手机矩阵主要包括以下几个步骤: 1.确定目标与需求:首先，明确打造手机矩阵的目的和需求，是为了进行电商运营、自媒体推广、任务管理还是其他目的。这将决定后续的手机数量、操作系统选择以及应用安装等。 2.选择手机与操作系统:根据…...

编程日记 2025/4/29 8:13:44

Ruby语言的编程范式

Ruby语言的编程范式在软件开发的世界里，编程语言不仅仅是实现功能的工具，更是一种表达思想和解决问题的方式。Ruby语言凭借其简洁优雅的语法和强大的功能，广受开发者喜爱，并逐步形成了一种独特的编程范式。本文将深入探讨Ruby语…...

编程日记 2025/4/29 9:17:35

【微服务】SpringBoot 整合Redis实现延时任务处理使用详解

目录一、前言二、延迟任务的高频使用场景三、延迟任务常用解决方案 3.1 Quartz 3.2 DelayQueue 3.2.1 Timer + TimerTask 3.2.2 ScheduledExecutorService 3.3 Redis sorted set 3.4 RabbitMQ 四、Redis实现延时队列操作实战 4.1 Redis Sorted Set 概述 4.1.1 Re…...

编程日记 2025/4/25 5:36:30

STM32烧写失败之Contents mismatch at: 0800005CH (Flash=FFH Required=29H) !

一）问题：用ULINK2给STM32F103C8T6下载程序，下载方式设置如下： 出现下面两个问题： 1）下载问题界面如下： 这个错误的信息大概可以理解为，在0x08000063地址上读取到flash存储为FF&am…...

编程日记 2025/5/3 19:40:38

图像分割综述

1. 简述图像分割（Image Segmentation）是计算机视觉领域中的一项基本任务，旨在将图像划分为多个具有语义或视觉意义的区域。这项任务在医学影像分析、自动驾驶、遥感图像处理、视频监控等领域都有着广泛的应用。随着深度学习技术的发展&…...

编程日记 2025/4/29 14:44:35

计算机毕业设计hadoop+spark知网文献论文推荐系统知识图谱知网爬虫知网数据分析知网大数据知网可视化预测系统大数据毕业设计机器学习

温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 作者简介：Java领…...

编程日记 2025/4/23 7:36:22

STM32-笔记38-I2C-oled实验

一、什么是I2C？ I2C总线，全称Inter-Integrated Circuit（互连集成电路），是一种由Philips（现NXP半导体）公司在1980年代初开发的同步串行半双工通信总线。二、有了串口通信为什么要使用I2C&…...

编程日记 2025/4/24 11:55:22

Vue Amazing UI 组件库（Vue3+TypeScript+Vite 等最新技术栈开发）

Vue Amazing UI 一个 Vue 3 组件库使用 TypeScript，都是单文件组件 (SFC)，支持 tree shaking 有点意思 English | 中文 Vue Amazing UI 是一个基于 Vue 3、TypeScript、Vite 等最新技术栈开发构建的现代化组件库，包含丰富的 UI 组件和常…...

编程日记 2025/5/1 17:13:08

Android NDK开发实战之环境搭建篇(so库,Gemini ai)

文章流程音视频安卓开发首先涉及到ffmpeg编译打包动态库，先了解动态库之间的cpu架构差异性。然后再搭建可运行的Android 环境。 So库适配⽇常开发我们经常会使⽤到第三库，涉及到底层的语⾳，视频等都需要添加so库。⽽so库的体积⼀般来说⾮…...

编程日记 2025/5/1 18:29:39

Word中所有的通配符使用方式[Word如何批量删除中文标点符号，英文标点符号，英文字母符号，数字符号，中文汉字符号]

Word中所有的通配符使用方式概念讲解通配符一览表详细介绍通配符的使用使用通配符搜索简洁通配符链接操作演示链接概念讲解 Word中的通配符是用在查找和替换中的正则表达式。通配符可以实现高级的查找替换，快速整理和排版文档。常用的通配符包括： “*…...

编程日记 2025/4/30 18:51:40

ElasticSearch内存占用率过高怎么办？

文章目录 1，先用top看看各个进程的内存占用情况2，不能简单的杀死进程，然后再重启。3，查看一下ElasticSearch进程的具体启动情况4，修改Elasticsearch 的Java堆内存 1，先用top看看各个进程的内存占用情况先…...

编程日记 2025/4/29 5:42:12

svelte5中使用react组件

在svelet5中导入并使用react组件库 svelte5中使用react组件 svelte5中使用react组件在svelet5中导入并使用react组件库, 示例项目地址：https://github.com/shenshouer/my-svelte-react 在svelte5中当前还有问题，无法将children传递到react中渲染使用…...

编程日记 2025/4/22 15:28:55