
前端三件套
文章平均质量分 91
前端三件套
人才程序员
软件:C/C++ Qt CMake 数据结构 Linux网络。C++Opencv Python 前端(HTML、CSS....) 鸿蒙软件开发ArkTS 硬件:51单片机,esp系列(esp32、esp8266、esp32-s3),stm32、freertos。openharmony。可以带徒弟:C/C++ Python Lua STM32 esp32
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
HTML 标签的关系详解
在 HTML 中,标签(Tag)是网页的基本组成单元,它们通过不同的关系组织在一起,形成网页的结构和层级。了解 HTML 标签的关系,不仅有助于编写清晰的 HTML 代码,也有助于更好地使用 CSS 和 JavaScript 进行页面布局和交互。HTML 的标签关系是页面结构的核心,理解这些关系可以帮助我们更好地编写 HTML、CSS 和 JavaScript 代码。HTML 标签通常是**嵌套(Nested)**使用的,即一个标签内部可以包含多个标签。本文将介绍 HTML 标签的主要关系,包括。原创 2025-02-19 21:39:11 · 972 阅读 · 0 评论 -
JavaScript 定时器使用详解
和,它们分别用于设置一次性延时和周期性重复执行的任务。JavaScript 中的定时器和是非常强大的工具,它们可以帮助你实现延时任务、周期性任务等功能。通过定时器,你可以轻松地控制任务的执行时机和频率。特性功能延迟执行一次函数周期性地定期执行函数执行次数仅执行一次一直重复执行,直到被清除使用场景延迟某个任务的执行定时任务、周期性更新页面内容等清除定时器语法定时器是 JavaScript 中非常有用的工具,掌握它的使用可以让你在开发中更加得心应手,尤其是在实现动态效果和任务调度时。原创 2025-02-28 21:29:08 · 979 阅读 · 0 评论 -
JavaScript 获取与设置表单值的方法
今天我们来深入了解一下 JavaScript 如何获取和设置表单中的值。表单是网页中交互的一部分,而通过 JavaScript 获取和设置表单值,不仅能够让你在提交前对数据进行验证和处理,还能实现动态更新表单内容。在本文中,我们将详细介绍如何使用 JavaScript 获取和设置不同类型的表单控件(如输入框、单选框、复选框等)的值。在 JavaScript 中,获取和设置表单值是非常常见的操作。属性,我们可以轻松地获取和设置不同类型的表单控件的值。属性,你也可以设置文本框的值。要获取文本框的值,可以使用。原创 2025-02-28 21:28:59 · 770 阅读 · 0 评论 -
HTML 注释详解
它们可以帮助开发者标注代码逻辑、隐藏部分代码,甚至用于调试。虽然注释不会影响网页的正常显示,但合理使用注释可以提高代码的可读性和可维护性。本篇文章将详细介绍 HTML 中的注释语法、用途、最佳实践,以及一些进阶技巧。在开发时,你可以使用注释来临时隐藏某些代码,而不必删除它们。在团队协作或自己维护代码时,适当的注释可以让代码更易读。代码本身如果已经足够清晰,就不需要额外的注释。2️⃣ 你如何使用注释临时隐藏 HTML 代码?这样,在需要时可以轻松恢复,而不必重新编写。原创 2025-02-19 21:39:01 · 1368 阅读 · 0 评论 -
JS之什么是字节流以及底层实现解析
在 JavaScript 中,字节流(Byte Stream)是指数据以字节为单位进行顺序读取和写入的一种方式。在进行文件操作、网络传输、加密解密等应用场景时,字节流是非常重要的概念,它使得程序能够按字节(8位为单位)逐个处理数据。这篇文章将详细讲解字节流的基本概念,并探讨 JavaScript 如何处理字节流及其底层实现。字节流是处理二进制数据的重要概念,广泛应用于文件操作、网络传输、加密解密等场景。虽然 JavaScript 并不直接操作底层的字节流,但提供了丰富的 API,如Blob。原创 2025-02-26 19:46:04 · 586 阅读 · 0 评论 -
JavaScript `reduce` 累计方法详解
reduce特点说明reduce用途用于数组元素的累积,返回一个最终结果返回值累计值,通常是一个单一的值(如求和、对象等)初始值可选,若不提供初始值,reduce会使用第一个元素适用场景数组求和、数组去重、对象合并、分组等复杂操作reduce是一个非常强大的工具,能够帮助你轻松处理数组中的复杂计算任务。掌握reduce的使用,将大大提高你的 JavaScript 编程能力!希望今天的分享能对你有所帮助。🎉。原创 2025-02-26 19:47:23 · 722 阅读 · 0 评论 -
CSS 版心居中:使页面内容完美居中
在现代网页设计中,推荐使用。原创 2025-02-17 20:35:01 · 772 阅读 · 0 评论 -
JavaScript中通过类名修改样式属性:让页面动态变更更轻松!
通过 JavaScript 操作类名是一种高效且灵活的方式,可以帮助我们动态地改变页面元素的样式。在实际开发中,你可以通过来为元素添加、删除、切换类名,也可以直接通过style属性来修改内联样式。记住,合理使用类名与样式,能够让你构建更富交互性的网页应用,带给用户更好的体验!👩💻✨下次当你需要让页面元素随着用户操作动态变化时,不妨用 JavaScript 和类名操作来给页面增添活力吧!原创 2025-02-28 21:28:51 · 729 阅读 · 0 评论 -
JavaScript 环境对象 `this` 与回调函数
概念解释示例代码this关键字this的指向依赖于函数调用的方式,常见的指向有全局对象、对象方法等。} test();全局作用域中的this在全局作用域中,this指向window(浏览器环境下)。// 输出 window 对象对象方法中的this在对象的方法中,this指向该对象本身。}};箭头函数中的this箭头函数没有自己的this,它继承外部函数的this。}};回调函数回调函数是将函数作为参数传递给另一个函数,在某些操作完成后调用。}, 1000);回调函数中的this回调函数中的。原创 2025-02-27 20:05:18 · 660 阅读 · 0 评论 -
【无标题】
静态资源是指内容不会随着每次请求而改变的文件,这些文件在服务器上是预先存在的,客户端可以直接访问并使用。HTML 文件:页面结构。CSS 文件:页面样式。JavaScript 文件:前端逻辑。图片文件(如.jpg.png.gif等)。字体文件(如.woff.ttf等)。与动态内容(如数据库查询结果)不同,静态资源不需要服务器进行计算,客户端可以直接获取。在 Express 中,静态资源的处理非常简单,使用中间件,你可以轻松地为文件夹中的文件提供服务。原创 2025-02-24 21:29:09 · 1026 阅读 · 0 评论 -
JavaScript 字符串常见方法:全面解析
JavaScript 的字符串方法非常丰富,掌握它们可以极大地提升你的编程效率。查找与替换indexOf()includes()replace()search()。切割与连接slice()split()。修剪与填充trim()padStart()padEnd()。大小写转换。匹配与提取match()。通过熟悉这些方法,你将能够轻松地操作和处理字符串,提升代码的可读性和可维护性。原创 2025-02-26 19:47:02 · 982 阅读 · 0 评论 -
HTML 标签语法详解
是网页的基本组成部分,负责网页的结构和内容展示。HTML 由**标签(Tag)**组成,每个标签都有特定的语法和作用。原创 2025-02-19 21:39:30 · 608 阅读 · 0 评论 -
体验 CSS:打造优美网页的魔法
通过 CSS,您可以轻松控制网页的样式、布局、响应式设计和动画效果,创造出视觉上独特且有趣的网页体验。随着对 CSS 的深入学习,您可以掌握更多技巧,打造更具互动性和动态效果的网页。原创 2025-02-18 21:17:47 · 913 阅读 · 0 评论 -
JavaScript `reduce` 累计方法详解
reduce特点说明reduce用途用于数组元素的累积,返回一个最终结果返回值累计值,通常是一个单一的值(如求和、对象等)初始值可选,若不提供初始值,reduce会使用第一个元素适用场景数组求和、数组去重、对象合并、分组等复杂操作reduce是一个非常强大的工具,能够帮助你轻松处理数组中的复杂计算任务。掌握reduce的使用,将大大提高你的 JavaScript 编程能力!希望今天的分享能对你有所帮助。🎉。原创 2025-02-26 19:47:12 · 824 阅读 · 0 评论 -
HTML 基本骨架详解
HTML(HyperText Markup Language,超文本标记语言)是构建网页的基础语言。每个网页的核心结构都依赖于 HTML,它提供了网页的基本框架。本文将详细介绍 HTML 的基本骨架结构、常见标签以及它们的作用。是全球通用的字符编码,支持中文、英文等各种语言,确保网页可以正确显示文本。标签是网页的主要内容区域,所有的可见元素(文本、图片、按钮等)都应该放在。它必须放在 HTML 文档的最顶部,确保网页按照现代标准解析。的文档声明,告诉浏览器这个页面使用的是。让网页变得更加美观和交互性更强!原创 2025-02-19 21:39:19 · 979 阅读 · 0 评论 -
CSS 选择器详解
CSS 选择器是用来选择HTML 元素的工具。通过选择器,我们可以指定样式规则应用到哪些 HTML 元素上。h1 {在这个例子中,h1是一个选择器,表示页面中的所有<h1>标签元素都将应用这一样式。CSS 选择器是网页样式设计的核心工具,掌握不同类型的选择器能让你更加灵活高效地控制网页元素的样式。无论是基础的元素选择器,还是更高级的组合、伪类和伪元素选择器,它们都能帮助我们实现各种样式效果。🚀建议在开发过程中,合理利用 CSS 选择器来组织和优化你的样式。原创 2025-02-18 21:17:31 · 809 阅读 · 0 评论 -
HTML 图像标签 (img) 详解
img>原创 2025-02-18 21:19:12 · 5193 阅读 · 0 评论 -
CSS 字体修饰属性详解
在网页设计中,字体的样式和装饰对提升用户体验和视觉效果非常重要。CSS 提供了多种字体修饰属性,可以帮助我们实现各种美观的文字效果。本文将介绍 CSS 中的字体修饰属性,包括字体的加粗、斜体、下划线等基本效果,并探讨它们的用法和应用场景。CSS 提供了多种字体修饰属性,帮助开发者根据需求调整文本的外观,使其更加符合设计要求。通过合理运用这些字体修饰属性,可以创造出既美观又有利于用户阅读的网页内容。等属性,网页设计师可以实现更丰富的文本效果,从而提升用户体验。属性用于设置字体的粗细程度。原创 2025-02-18 21:17:18 · 888 阅读 · 0 评论 -
CSS 中的行高 (line-height) 和字体族 (font-family)
行高 (:设置文本行之间的间距,常见值为数字、长度单位或百分比。适当的行高能提高文本的可读性。字体族 (:设置文本的字体类型,通过指定多个字体作为备选,确保文本在不同浏览器和设备上的一致性。通过 line-height和 font-family的结合使用,我们可以更好地控制文本的外观和布局,提升用户体验。正确配置这两个属性不仅能优化网页的排版,还能使网站内容更加清晰、易读,提升整体设计感。原创 2025-02-18 21:17:05 · 996 阅读 · 0 评论 -
CSS 外边距合并与塌陷问题解析
外边距合并是指在某些情况下,垂直方向上的相邻元素的外边距(margin)会“合并”为一个值,而不是按照两个外边距的和来计算。外边距合并和塌陷是 CSS 布局中常见的问题,尤其在使用块级元素时。这种现象虽然符合逻辑,但在实际开发中有时会导致不期望的布局问题。添加内边距或边框:这可以有效防止外边距合并。为父元素设置min-height:防止外边距塌陷。使用浮动或定位:浮动元素通常不参与外边距合并,避免塌陷。原创 2025-02-17 20:34:42 · 1038 阅读 · 0 评论 -
深入理解 JavaScript 的原型对象 `prototype`
prototypeJavaScript 的原型对象prototype是实现继承和共享方法的重要机制。通过原型链,我们能够共享方法和属性,避免重复定义,并且能够实现面向对象编程中的继承机制。理解原型及原型链的工作原理,是深入掌握 JavaScript 面向对象编程的关键。构造函数的prototype:每个函数都拥有一个prototype属性,指向该构造函数的原型对象。原型链:对象可以通过原型链继承父类的方法和属性。继承:通过修改prototype,我们可以实现继承关系。属性:每个对象都有一个。原创 2025-02-26 19:46:54 · 726 阅读 · 0 评论 -
JavaScript 实例成员与静态成员:对象与类的函数
实例成员是属于类的每个实例(对象)的属性或方法。当你创建了类的一个对象时,实例成员将成为该对象的一部分。每个对象都有自己独立的实例成员。静态成员是属于类本身的属性或方法,而不是类的实例。静态成员不依赖于类的实例对象,它们可以直接通过类名来访问。静态成员对于所有实例是共享的,它们在内存中只有一份。实例成员:属于类的每个实例,可以通过实例访问。每个对象实例拥有独立的实例成员。静态成员:属于类本身,可以通过类名直接访问。所有实例共享同一个静态成员。原创 2025-02-27 20:03:23 · 724 阅读 · 0 评论 -
CSS 消除默认样式详解
CSS Reset 是一种通过全局重置 CSS 样式,消除浏览器默认样式的方法。它通过将浏览器的默认样式清空或重置为统一的状态,确保开发者从零开始为每个元素定义样式。消除默认样式是前端开发中的一个重要步骤,尤其是在做跨浏览器开发时。CSS Reset:如 Eric Meyer 的 Reset,完全清除浏览器的默认样式。:标准化浏览器间的差异,保留一些有用的默认样式。使用通配符和:为所有元素统一样式,解决布局问题。手动清除常见元素的默认样式:如清除列表、表单元素、链接等的默认样式。原创 2025-02-17 20:34:54 · 1536 阅读 · 0 评论 -
HTML 标签与段落详解
段落标签<p>:定义文本段落,默认有间距。换行标签<br>:用于换行,不影响段落结构。水平线<hr>:创建视觉分隔线。标题标签:用于结构化文本,影响 SEO。格式化标签:如<b><i><mark>用于增强文本样式。文本对齐:使用text-align控制文本排列。掌握这些基础知识,你就能更好地编写结构清晰、可读性强的 HTML 页面了!🎉。原创 2025-02-18 21:19:27 · 936 阅读 · 0 评论 -
CSS 引入方式详解
内联 CSS 是将 CSS 样式直接写在 HTML 标签的style属性中。这种方式适用于少量的样式修改,但不推荐在大型项目中使用。内部 CSS 是将 CSS 样式写在 HTML 文件的<style>标签中,通常放在<head>标签内。这种方式适用于单一页面的样式定义。外部 CSS 是将 CSS 样式写在独立的.css文件中,通过<link>标签将其引入到 HTML 文件中。这是推荐的方式,适用于大型项目,能够让样式和内容分离,便于管理和维护。内联 CSS:适合单个元素快速调整样式,但不适合复杂项目。原创 2025-02-18 21:17:39 · 1014 阅读 · 0 评论 -
在 Node.js 中使用 `nodemon` 提高开发效率
nodemonnodemon是一个非常有用的工具,它能够在文件发生变化时自动重启 Node.js 应用程序,极大提高了开发效率。在实际开发过程中,通过使用nodemon,你可以减少重复启动应用程序的工作,专注于编码和开发。使用总结通过nodemon可以轻松监控文件变化,并自动重启应用程序。支持多种自定义配置,适应不同的开发需求。可以通过配置脚本命令,方便团队协作和自动化工作流。随着项目逐步发展,nodemon将成为你开发中不可或缺的工具之一,助你提升开发效率,让编码过程更加轻松愉快。原创 2025-02-24 21:29:02 · 1088 阅读 · 0 评论 -
HTML 文本格式化标签详解
在 HTML 中,文本格式化标签用于控制文本的显示方式,如加粗、斜体、下划线、删除线等。这些标签可以帮助我们更好地呈现网页中的内容,使其更加清晰和美观。,并且表达强调的语气,搜索引擎会给予更高的权重。,通常用于术语、外来词或其他特殊情况。的文本,通常用于价格或已废弃的内容。,常用于搜索结果或需要突出的信息。,适用于版权声明或注释信息。,但不表示强调或插入内容。的文本,通常会显示删除线。,但不表示文本的重要性。,常用于数学公式或指数。,常用于化学元素或脚注。,通常会带有下划线。,适用于文档或教程。原创 2025-02-19 21:38:52 · 1027 阅读 · 0 评论 -
Node.js Web 开发模式与身份认证概念
开发模式描述传统 Web 开发模式单体应用,所有功能集中处理,适合小型应用。微服务开发模式将应用拆分为多个独立的服务,适合大型应用和高并发场景。单页面应用(SPA)前后端分离,前端动态加载页面,后端提供 API 接口。身份认证方式描述基于会话认证依赖服务器存储的会话信息,适用于传统 Web 应用。基于令牌认证使用 JWT 令牌,无状态认证,适合分布式应用。OAuth 2.0支持第三方授权,适用于跨平台身份认证。原创 2025-02-24 21:28:28 · 943 阅读 · 0 评论 -
AJAX 入门与 Axios 基本使用
AJAX 是一种通过 JavaScript 向服务器发送请求并接收响应的技术。它使得网页能够在不重新加载的情况下与服务器进行数据交换。AJAX 允许网页与服务器之间进行异步交互,用户可以在不等待页面加载完成的情况下继续进行其他操作。:是传统的 JavaScript 对象,用于与服务器交换数据。JSON:现代的 AJAX 请求通常使用 JSON 格式作为数据交换格式。JavaScript:通过 JavaScript 控制网页和服务器之间的交互。AJAX。原创 2025-02-24 21:28:04 · 782 阅读 · 0 评论 -
Node.js 中的 `exports` 对象
exports在 Node.js 中,exports和是用于导出模块内容的核心机制。通过它们,你可以将函数、对象或类等暴露给外部模块使用。exports:用于导出多个功能,通常是暴露对象的属性或方法。:用于导出单个值(函数、对象、类等),如果你直接赋值给exports不再起作用。掌握exports和的用法,可以帮助你编写更加模块化和易维护的代码,为 Node.js 应用程序奠定基础。🚀。原创 2025-02-25 20:48:17 · 984 阅读 · 0 评论 -
JavaScript `forEach` 遍历数组详解
forEach是 JavaScript 数组的一个内建方法,用于遍历数组中的每一个元素,并对每个元素执行指定的回调函数。与传统的for循环相比,forEach提供了更简洁、更具表现力的语法。// 代码逻辑});element:当前正在处理的数组元素。index(可选):当前元素的索引。array(可选):原始数组本身。forEach特点说明forEach用途遍历数组的每个元素返回值无,返回undefined适用场景执行副作用(打印、修改外部状态等)与map对比map返回新数组,而。原创 2025-02-26 19:47:55 · 1005 阅读 · 0 评论 -
CSS 显示模式详解
display属性决定了一个元素在网页中的显示方式。不同的display值控制着元素的布局方式、对其他元素的影响以及占据的空间。常见的displayblockinlinenoneflexgridinheritinitialunset会使元素表现为块级元素。块级元素会在页面中占据一整行,并且可以设置宽度和高度。使元素表现为内联元素。内联元素不会独占一行,而是与其他元素并排显示。是块级和内联的结合体。元素表现得像内联元素一样与其他元素并排显示,同时也可以设置宽度和高度。原创 2025-02-17 20:35:36 · 641 阅读 · 0 评论 -
JavaScript 数组解构与对象解构:简化数据提取操作
解构赋值是 ECMAScript 6 (ES6) 引入的一项新特性,它允许我们从数组或对象中提取值并赋给变量。这不仅减少了代码量,还使得代码更加易读。数组解构和对象解构。原创 2025-02-27 20:03:30 · 630 阅读 · 0 评论 -
Node.js 中的包与 npm —— 包的概念、格式化时间的两种做法以及包管理配置文件
npm(Node Package Manager)是 Node.js 默认的包管理工具,它允许我们在项目中安装和管理依赖的 JavaScript 库(即包)。npm 是全球最大的开源库生态系统,几乎所有常用的 Node.js 工具和库都可以通过 npm 进行安装和管理。在 npm 中,包指的是可以被 Node.js 应用程序使用的模块或库。包通常包含 JavaScript 文件、资源文件、文档和其他可以重用的代码。每个 npm 包都有一个文件,记录了包的元数据和配置信息。你可以通过命令来安装一个包。原创 2025-02-24 21:29:52 · 863 阅读 · 0 评论 -
JavaScript 构造函数与 `new` 实例化:从原理到应用
构造函数是用于创建对象的特殊函数。它定义了对象的初始化过程,包括对象的属性和方法。通常,构造函数的名字以大写字母开头,以符合约定俗成的命名规范。在 JavaScript 中,构造函数的行为与普通函数类似,但它有一个特别的目的:通过new操作符来创建实例化对象。构造函数用于创建和初始化对象。通过构造函数,你可以定义对象的属性和方法。构造函数通常以大写字母开头,符合约定的命名规范。原创 2025-02-26 19:47:47 · 673 阅读 · 0 评论 -
CSS 背景属性:拆分写法与复合写法解析
CSS 的背景属性是网页设计中非常重要的一部分。它不仅可以为网页元素添加背景颜色、背景图片、背景定位等,还能通过多种方式提升页面的视觉效果。为了实现这些功能,CSS 提供了两种常见的背景书写方式:拆分写法和复合写法。本文将详细介绍这两种方式,并帮助你更好地理解它们的使用场景。CSS 背景属性可以设置多个背景相关的值,主要有以下几个:这些背景属性可以单独使用,也可以通过复合写法合并在一起。接下来,我们将通过具体示例来详细说明拆分写法和复合写法。在拆分写法中,我们将每个背景属性单独写出,并分别设置它们的值。每一原创 2025-02-17 20:37:37 · 1082 阅读 · 0 评论 -
Node.js 中的 CommonJS 模块化规范
CommonJS 是一种 JavaScript 模块化规范,旨在解决 JavaScript 中模块导入、导出和依赖管理的问题。它被广泛应用于 Node.js 中,虽然也有其他模块化规范(例如 ES6 的importexport),CommonJS 仍然是 Node.js 中的标准。模块化的导出:每个文件就是一个模块,可以通过导出模块的公共接口。模块化的导入:可以通过require()函数加载模块并使用其导出的内容。同步加载。原创 2025-02-24 21:30:02 · 669 阅读 · 0 评论 -
CSS 盒子模型详解
在 CSS 中,盒子模型是指浏览器如何计算元素的尺寸和位置。每个元素在页面上都占据一个矩形区域,这个区域的大小和布局由盒子模型来控制。盒子模型包括了元素的内容区域(content)、内边距(padding)、边框(border)和外边距(margin)。通过理解盒子模型,我们可以更精确地控制页面元素的位置、间距和大小。盒子模型是网页布局的核心,它控制着每个元素的大小和位置。内容区域内边距边框和外边距。默认情况下,计算模型只影响内容区域的尺寸,而border-box。原创 2025-02-17 20:35:09 · 854 阅读 · 0 评论 -
Node.js 模块加载机制解析:深入了解 `require` 和模块缓存
Node.js 的模块系统基于 CommonJS 规范,模块化的核心思想是将每个文件视为一个独立的模块。每个模块都有自己的作用域,并且可以通过require来引入其他模块。Node.js 通过一套复杂的机制来管理模块的加载、缓存和路径解析,使得开发者可以高效地管理代码。解析模块路径:Node.js 会根据模块标识符来解析模块的路径。加载模块:加载指定路径的模块文件。执行模块代码:执行模块文件中的 JavaScript 代码,并导出需要暴露的功能。缓存模块:已加载的模块会被缓存,防止重复加载。原创 2025-02-24 21:29:25 · 1275 阅读 · 0 评论 -
Node.js 中的 Session 原理与 Session 中间件的使用
Session是一种用于保存用户状态信息的机制。由于 HTTP 协议本身是无状态的(即每次请求都是独立的),Session 使得我们能够跨多个请求保存用户信息,比如用户的登录状态、购物车内容等。Session是一种在服务器端存储用户状态的机制,用于跨多个请求保持会话数据。它比Cookie更安全,因为它将敏感数据存储在服务器上,而不是客户端。在 Node.js 中,我们可以使用中间件来管理 Session,存储用户信息、处理登录状态等。原创 2025-02-24 21:28:13 · 956 阅读 · 0 评论