JavaScript 表单验证 October 10, 2025 1420 words • 8 min read HTML5 为表单输入框提供了一套强大的内置验证机制,通过添加特定的属性即可启用: - `required`:必填字段。 - `type="email"` / `type="url"`:验证字段是否为有效的 Email 或 URL 格式。 - `minlength` / `maxlength`:限制文本输入的最小/最大长度。 - `min` /... #JavaScript#Frontend
JavaScript 视图 October 9, 2025 1494 words • 8 min read 在前端开发中,视图 (View) 是用户在浏览器中看到和交互的一切——也就是用户界面(UI)。JavaScript 的核心任务之一就是**动态地操纵这个视图**,以响应用户操作或数据变化。 最原始的视图操作方式是直接使用 DOM API。 ```javascript // 1. 获取一个 DOM 元素 const container = document... #JavaScript#Frontend
npm 包管理器 October 9, 2025 1090 words • 6 min read npm 是 JavaScript **包管理器 (Package Manager)**。它主要由两部分组成: 1. **一个在线仓库 (Registry)**:一个巨大的、公开的数据库,存储了海量的、可重用的 JavaScript 代码包(Packages)。这些包可以是小型的辅助函数库(如 `lodash`),也可以是完整的前端框架(如 `React`, `Vue`)。 2... #JavaScript#Frontend
js-module October 9, 2025 1291 words • 7 min read 在 ES6 模块出现之前,如果在 HTML 中引入多个 JavaScript 文件,它们会共享同一个全局作用域。这会导致变量命名冲突和不可预期的行为。 ```html <. html --> <script src="one... #JavaScript#Frontend
JavaScript Class October 9, 2025 1315 words • 7 min read 在 ES6 之前,我们使用构造函数和原型链来实现对象的创建和继承。ES6 引入了 `class` 关键字,它提供了一种更清晰、更简洁的语法。 > Class 的底层实现仍然是基于原型继承。因此,`class` 被称为“语法糖”。 **构造函数 vs. Class 写法对比:** ```javascript // 传统构造函数写法 function Player(name, marker)... #JavaScript#Frontend
闭包 October 8, 2025 1437 words • 8 min read JavaScript 有如下的作用域: - **全局作用域 (Global Scope)**: 在所有函数和代码块 `{}` 外面定义的变量,在代码的任何地方都可以被访问。 > 过度使用全局变量会造成“全局污染”。 - **函数作用域 (Function Scope)**: 使用 `var` 在一个函数内部声明的变量,它的“地盘”就是整个函数。 - **块级作用域 (Block... #JavaScript#Frontend
container-design October 8, 2025 26 words • 1 min read Write your blog post content here. This is a new blog post... #HTML#CSS#Frontend
Grid October 7, 2025 2128 words • 11 min read CSS Grid 布局是一个强大的**二维 (2D)** 布局系统,意味着它可以同时处理**行和列**。与 Flexbox(一维)不同,Grid 允许我们在两个维度上对齐项目,是专门为解决复杂的网页布局问题而设计的。 Grid 由以下组件组成: - **Grid 容器 (Grid Container)**:应用了 `display: grid;` 的父元素。 - **Grid 项目... #CSS#Frontend
JavaScript 原型链 October 7, 2025 1524 words • 8 min read 我们可以在构造函数里为对象添加方法,但这存在一个严重的性能问题。 ```javascript function Player(name, marker) { this. name = name; this... #JavaScript#Frontend
JavaScript 基础 October 6, 2025 6245 words • 32 min read ```javascript // 创建数组 const fruits = ["Apple", "Banana", "Cherry"]; // 访问元素 console. log(fruits[0]); // "Apple" // 修改元素 fruits[1] = "Blueberry"; // 添加元素 fruits... #JavaScript#Frontend