星野集-个人编程学习与开发笔记归档|站长博客 | 前端核心技术基础踩坑实录

JavaScript变量里的函数：counter 和 counter() 到底有啥区别？

笔记

刚学 JavaScript 的时候，我曾被一个看似简单的问题卡住过： const counter = createCounter(); console.log(counter); // 输出 [Function (anonymous)] console.log(counter());

HTML5核心特性-第4章-4.3-自定义表单控件

HTML5+CSS3教程

学习目标掌握HTML5中<datalist>、<progress>、<meter>等自定义表单控件的语法与应用场景能够实现带自动建议功能的输入框、动态进度展示和计量条效果理解自定义控件的浏览器兼容性问题及解决方案概念讲解 HTML5除了新增基础输入类型外，还引入了一系列自定义表单控件，这些控

JavaScript变量声明：从var到let再到const，新手避坑必看的底层规则

笔记

学JavaScript时，很多人会忽略“变量声明”这个基础操作，觉得“不就是var a = 1吗？”。但等你写了几百行代码，突然被ReferenceError: a is not defined报错，或者发现循环里的变量“串味”了，才会意识到：变量声明的方式，直接决定了代码的行为和稳定性。这篇文章

差一错误：编程中不可忽视的边界哲学

笔记

在软件研发领域，有一种错误因其隐蔽性和普遍性，常被称为“开发者的慢性病”——差一错误（Off-by-One Error, OBOE）。它不会像内存泄漏或空指针异常那样直接导致程序崩溃，却能在看似正确的逻辑中埋下隐患，让测试通过的代码在边界条件下突然失效。这种错误的本质，是人类直觉对“范围”的模糊认知

HTML5核心特性-第4章-4.2-表单验证属性

HTML5+CSS3教程

一、学习目标掌握HTML5表单验证的核心属性（required、pattern、placeholder、min/max等）理解客户端表单验证的作用与局限性能够通过验证属性实现基础表单数据校验二、概念讲解表单验证是确保用户输入数据符合预期格式的重要手段。HTML5引入了原生表单验证属性，无需

HTML5核心特性-第4章-4.1-新增输入类型

HTML5+CSS3教程

学习目标掌握HTML5新增的10种输入类型及其语法理解不同输入类型的浏览器支持情况能够在实际表单中正确应用新增输入类型并处理兼容性问题概念讲解 HTML5为表单控件引入了10种新增输入类型，旨在提升用户输入体验和数据验证效率。这些输入类型由浏览器原生支持，无需额外JavaScript即可实现

数组的「删尾术」：JavaScript 的 pop() 方法，你真的会用吗？

笔记

之前我们聊过用 push() 往数组末尾「塞」元素，今天咱们换个方向——如果想在数组的「尾巴」上「剪一刀」，该用哪个方法？答案就是 pop()。别小看这个方法，它在实际开发中可没少帮我们「善后」。比如用户列表要移除最后一条记录、购物车要删除刚添加的商品……这些场景都可能用到它。咱们今天就掰开了、揉

一行JavaScript代码：用push()方法往数组里「塞」元素，到底发生了什么？

笔记

最近在帮朋友调试前端代码时，发现他对数组的push()方法理解得不太透彻。他写了一段代码，但对执行结果一知半解，于是我决定用这篇博客帮他（也帮你）彻底搞明白——当我们调用push()时，JavaScript到底在背后做了什么。先看一段简单的代码我们从一个具体的例子入手。假设你有一个数组，里面存着

HTML5核心特性-第3章-3.4-语义化实战：博客页面结构

HTML5+CSS3教程

一、学习目标掌握语义化标签在实际项目中的组合应用能够使用<header>/<nav>/<article>/<aside>等标签构建完整博客页面结构理解语义化布局的常见错误及优化方法二、实战背景本实战将构建一个简易博客首页，包含顶部导航、文章列表、侧边栏推荐和页脚信息，重点展示如何通过语义化

HTML5核心特性-第3章-3.3-内容型语义标签

HTML5+CSS3教程

学习目标区分<article>、<section>、<aside>等内容型语义标签的核心用途掌握不同标签在实际页面中的正确嵌套关系能够通过内容型标签构建符合W3C标准的文档结构概念讲解内容型语义标签是HTML5引入的核心创新之一，它们不同于<div>等通用容器，通过标签名直接表达内容的内在

HTML5核心特性-第3章-3.2-结构型语义标签

HTML5+CSS3教程

学习目标掌握6个核心结构型语义标签的语法与适用场景能够使用语义化标签构建符合W3C标准的页面骨架区分<header>/<nav>/<main>等标签的功能边界概念讲解结构型语义标签是HTML5引入的一类具有明确含义的标签，它们不再像传统<div>那样仅用于布局，而是通过标签名直接表达内容的

HTML5核心特性-第3章-3.1-语义化的价值与原则

HTML5+CSS3教程

一、语义化的核心价值语义化是指使用恰当的HTML标签来描述内容的含义，而非仅用于布局。其核心价值体现在三个维度： 1.1 提升搜索引擎优化（SEO）搜索引擎爬虫依赖标签理解页面内容结构。语义化标签（如<article>、<section>）能明确指示内容优先级，帮助爬虫更准确地索引核心内容。例如

📌 VSCode高效注释指南：快速注释代码的实用技巧

笔记

为什么需要掌握注释技巧？在代码调试、功能测试或团队协作中，快速注释/取消注释代码是高频操作。手动逐行添加符号不仅低效（统计显示开发者平均每天浪费8分钟在机械注释上），更会打断思维流。本文将用2分钟教会你VSCode中「一键封印代码」的核心方法，提升30%以上编码效率一、核心方法：快捷键操作

html5+css3基础入门-第2章-2.3-注释与代码规范

HTML5+CSS3教程

一、学习目标掌握HTML注释的语法规则及使用场景理解代码格式化对可维护性的影响，掌握缩进与命名规范掌握语义化书写原则，区分结构与样式的职责边界二、概念讲解 2.1 注释的作用与意义 HTML注释是对代码的说明性文字，不会被浏览器解析显示，其核心价值在于：提高可读性：帮助团队协作或后期维护时

html5+css3基础入门-第2章-2.2-基础标签与属性

HTML5+CSS3教程

学习目标掌握HTML基础文本标签的语义与用法理解并正确使用通用属性（class、id、style）能够区分块级元素与行内元素的显示特性概念讲解 HTML标签是构建网页内容的基本单元，分为文本标签（用

弹