- 博客(40)
- 收藏
- 关注
RSS订阅原创 深入浅出JS事件：从基础原理到实战进阶全解析
本文从事件的核心概念出发，逐步深入讲解了事件流、事件绑定方式、事件委托、防抖节流等关键知识点，并结合实战案例和避坑指南，帮你全面掌握JS事件开发。核心要点回顾：事件流分为捕获、目标、冒泡三个阶段，可通过`stopPropagation`阻止冒泡三种事件绑定方式各有优劣，DOM2级（`addEventListener`）是现代开发的首选事件委托利用冒泡机制，实现高效的批量元素事件处理，支持动态元素防抖和节流是解决高频事件性能问题的核心方案，需根据场景选择使用。
2025-12-28 20:49:25
551
原创 深入浅出理解AJAX：核心原理与POST/GET区别详解
AJAX（Asynchronous JavaScript and XML），即异步JavaScript和XML，是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。它的出现彻底改变了传统网页的交互方式，让网页拥有了类似桌面应用的流畅体验（比如百度搜索的实时联想、知乎的下拉加载更多等）。1. AJAX的核心是异步请求，通过XMLHttpRequest/Fetch API实现无刷新数据交互，提升页面体验；
2025-12-26 14:14:25
988
原创 深入理解JS DOM：从基础操作到性能优化的全面指南
重排（Reflow）：当DOM元素的几何属性（如宽高、位置、数量）发生变化时，浏览器需要重新计算元素的布局位置，这个过程就是重排。重排会影响整个DOM树的布局，开销极大。重绘（Repaint）：当DOM元素的非几何属性（如颜色、背景色、透明度）发生变化时，浏览器不需要重新计算布局，只需重新绘制元素的外观，这个过程就是重绘。重绘开销小于重排，但频繁重绘也会影响性能。理解本质：DOM是树形数据结构，JS操作DOM是跨线程交互，性能开销主要来自重排重绘；优先精准：查找节点时缩小范围，优先使用高效API；批量操作。
2025-12-25 20:48:26
918
原创 js函数基础
JavaScript中常见的函数定义方式有4种，不同方式适用场景不同，需灵活选择。当一个内部函数被外部函数返回并在外部调用时，内部函数依然能访问外部函数的作用域变量，这种现象就是闭包。此时外部函数的作用域不会被垃圾回收机制回收，而是被内部函数引用。函数提升仅适用于函数声明，函数表达式无提升箭头函数无自己的this，继承外层作用域的this，不可作为构造函数arguments是类数组对象，箭头函数无arguments，需用剩余参数替代默认参数的赋值时机是函数调用时，而非定义时。
2025-12-24 19:43:52
970
原创 js模糊搜索
模糊搜索（Fuzzy Search）是一种允许用户输入不完全准确或包含错误的查询，系统仍能返回相关结果的搜索技术。与精确匹配不同，模糊搜索能够处理拼写错误、近似发音或部分匹配的情况。
2025-12-20 20:29:30
351
原创 JavaScript图表制作：从入门到精通
它的核心优势在于完全的数据驱动和极高的自定义能力，可以创建任何你能想象的可视化效果。：对于时间序列数据，可以采用不同时间粒度的聚合。预先计算多个聚合级别的数据，根据当前视图的缩放级别自动选择合适的数据层。：这是一种平滑数据的有效方法，通过计算连续数据点的平均值来消除短期波动，突显长期趋势。对于频繁重绘的复杂元素（如带有渐变、阴影的图形），可以预先在离屏Canvas中绘制好，需要时直接复制到主画布。：通过算法识别数据中的“重要点”，如极值点、拐点、数据突变的边界点等，优先保留这些点而舍弃相对平稳区域的数据。
2025-12-19 20:56:24
916
原创 【JS高分总结】吃透这8个核心知识点，告别面试与开发踩坑
原始类型（栈存储）：String、Number、Boolean、Null、Undefined、Symbol（ES6）、BigInt（ES11），值不可变，赋值为 “值拷贝”；引用类型（堆存储）：Object（包含 Array、Function、Date、RegExp 等），值可变，赋值为 “引用拷贝”（多个变量指向同一内存地址）。基础循环：for（适合索引遍历）、for...in（遍历对象属性，含原型链，不推荐遍历数组）、for...of（遍历可迭代对象，如数组 / 字符串，推荐）；
2025-12-17 20:35:08
326
原创 js常用事件
通过detail: { message: "这是自定义数据" }});// 输出：这是自定义数据});// 触发事件鼠标事件click– 鼠标单击元素时触发dblclick– 鼠标双击元素时触发mouseenter– 鼠标指针移入元素范围内时触发（不冒泡）mouseleave– 鼠标指针移出元素范围时触发（不冒泡）mouseover– 鼠标指针移入元素或其子元素时触发（冒泡）mouseout– 鼠标指针移出元素或其子元素时触发（冒泡）mousemove– 鼠标指针在元素内移动时连续触发。
2025-12-17 19:46:50
849
原创 使用jQuery动态操作HTML和CSS
方法可以直接修改元素的样式属性。该方法既可以获取单个属性值，也可以设置单个或多个属性。方法专门用于处理布尔属性如checked、disabled等。：将样式变化封装在CSS类中，通过类名操作而非直接样式修改。jQuery支持方法链，可以在单个语句中执行多个操作。动态修改HTML内容可以通过多种方法实现。方法用于获取或设置元素的HTML内容，单位处理：自动处理数值型属性的单位添加。jQuery提供了简洁的事件绑定方法。jQuery简化了AJAX请求的处理。方法可以读取或修改DOM元素的属性，
2025-12-13 21:20:19
840
原创 JavaScript学习
从变量、数据类型、运算符等基础语法开始，逐步学习条件语句、循环、函数等核心概念。掌握如何使用 JavaScript 操作网页元素（DOM），包括增删改查节点，以及绑定点击、滚动等事件。学习回调函数、Promise 和 async/await，理解异步代码的执行逻辑。基础扎实后，选择 React、Vue 或 Angular 等框架学习，结合项目实战（如 Todo 应用）加深理解。熟悉箭头函数、解构赋值、模块化（import/export）等现代语法，提升代码简洁性和可维护性。从简单页面开始，逐步增加复杂度。
2025-12-12 23:59:35
608
原创 有关js作用域
JavaScript 作用域的核心是「词法作用域 + 作用域链」，通过全局、函数、块级三类作用域实现变量的分层管理；ES6 新增的let/const补全了块级作用域，解决了var的设计缺陷；理解作用域的关键是区分「静态规则（作用域）」和「动态执行（上下文）」，以及变量查找的「从内到外」逻辑。作用域是闭包、模块化、变量提升等核心特性的底层基础，也是编写健壮 JS 代码的必备认知。
2025-12-11 20:21:44
696
原创 关于递归函数
递归函数是指在函数内部调用自身的函数。它通常用于解决可以分解为相同问题的子问题的情况，例如阶乘、斐波那契数列、遍历树或链表等数据结构。
2025-12-10 19:39:26
475
原创 学好js与jquery
jQuery 就像原生 JS 的 “懒人工具箱”：原生 JS 获取元素要写，jQuery 只用$("#id")；原生绑定事件要写，jQuery 直接；原生改样式要逐行拼style，jQuery 用css()一行搞定，还能链式调用多个操作。它的核心就是把原生 JS 里繁琐、易出错、不兼容的代码封装成简单的方法，所有语法都围绕 “先通过$()
2025-12-05 20:11:05
881
原创 js流程控制语句
JavaScript中的流程控制语句用于控制代码的执行顺序，根据条件或循环逻辑决定代码块的执行路径。主要包括条件语句和循环语句两大类。
2025-12-03 19:49:53
942
原创 js中函数声明和函数表达式的区别
通常将函数定义为一个表达式，赋值给变量（或作为其他表达式的一部分），函数名可选（匿名函数或命名函数表达式）。不会被整体提升，只有变量声明会被提升，而函数定义（赋值）保留在原地。因此，在赋值之前调用变量会得到。实际开发中，可根据是否需要提前调用、是否作为值传递等需求选择合适的方式。ES6 的箭头函数（到当前作用域的顶部，意味着可以在函数声明之前调用该函数。关键字开头，直接指定函数名，不需要赋值给变量。）本质上是一种更简洁的匿名函数表达式。
2025-12-03 19:40:04
384
原创 js传参的几种方式
将数据存储在浏览器的本地存储中，可以在不同页面间共享。在触发事件时传递参数，例如点击事件或自定义事件。利用闭包的特性，在函数内部访问外部函数的变量。发送异步请求，参数可以放在URL或请求体中。在模块化的JavaScript中，可以通过。，数据会通过URL或请求体传递。在URL中直接附加参数，使用。分隔URL和参数，多个参数用。
2025-12-01 19:48:06
213
原创 关于JSON
JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，易于人阅读和编写，也易于机器解析和生成。基于 JavaScript 的子集，但独立于语言，广泛用于 Web 应用程序和 API 数据传输。
2025-11-20 19:44:15
408
原创 JavaScript 与 jQuery 的区别与联系
jQuery 是一个基于 JavaScript 的库，封装了常见的 DOM 操作、事件处理、动画效果和 AJAX 请求，简化了 JavaScript 的编写。原生 JavaScript 通常比 jQuery 更快，因为 jQuery 需要额外的抽象层。但在大多数场景中，差异不明显。JavaScript 是一种脚本语言，用于在网页上实现动态交互功能。它是浏览器的原生语言，可以直接操作 DOM、处理事件、发送网络请求等。如果需要类似 jQuery 的简洁语法，但不想引入整个库，可以考虑轻量级替代品（如。
2025-11-20 19:44:02
500
原创 js事件基础步骤及代码
事件是用户在网页上的交互行为（如点击、滚动、输入等）或浏览器自动触发的动作（如加载完成）。JavaScript 通过事件监听机制实现与用户的动态交互。
2025-11-19 19:42:43
309
原创 用VSCode打造AI开发环境的技术
安装Jupyter插件，支持交互式AI模型开发。添加GitLens或GitHub插件，便于版本控制与协作。下载并安装最新版VSCode，确保系统兼容性。通过扩展商店安装Python插件，支持语法高亮和调试功能。配置MLflow或Weights & Biases插件，跟踪实验数据。添加Postman插件，测试API化模型接口。配置SSH远程开发插件，连接云服务器或本地高性能机器。集成Docker插件，管理容器化AI开发环境。在VSCode中配置解释器路径，指向虚拟环境的Python可执行文件。
2025-11-19 19:41:12
314
原创 js渲染的基本概念与方法
JS 渲染是指通过 JavaScript 动态生成或修改网页内容的过程。与传统的服务端渲染（SSR）不同，JS 渲染通常在客户端完成，能够实现更灵活的交互和动态内容更新。现代前端框架（如 React、Vue、Angular）通过虚拟 DOM 或响应式系统高效管理渲染。模板引擎（如 Handlebars、EJS）允许开发者定义模板，并通过数据填充生成动态内容。通过以上方法，可以高效实现动态、交互丰富的网页内容渲染。：后续交互由客户端 JS 处理，实现动态更新。
2025-08-22 17:30:06
310
原创 js图表制作
Chart.js是一个流行的开源JavaScript库，用于创建响应式、交互式的数据可视化图表。支持多种图表类型，包括折线图、柱状图、饼图等。Google Charts提供免费且易于使用的图表解决方案，可直接从Google服务器加载。D3.js是一个功能强大的数据驱动文档库，适合创建高度定制化的复杂可视化。Highcharts是一个专业的图表库，支持多种图表类型和丰富的交互功能。ECharts是由百度开发的强大图表库，支持大量图表类型和高度定制化。
2025-08-22 10:32:04
256
原创 js递归函数的应用
递归函数是指在函数内部调用自身的函数。递归通常用于解决可以分解为更小相似子问题的情况，例如阶乘、斐波那契数列、树形结构遍历等。递归是 JavaScript 中强大的编程技巧，合理使用能简化代码逻辑，但需注意性能和边界条件。
2025-08-21 16:19:09
357
原创 递归的知识点
递归是一种函数调用自身的技术，通常用于解决可以分解为更小子问题的问题。在jQuery中，递归可以用于遍历DOM树、处理嵌套数据结构或实现动画效果。递归在jQuery中是一个强大的工具，但需谨慎使用以确保代码的效率和可维护性。递归非常适合遍历DOM树的嵌套结构，例如查找所有子元素或执行特定操作。如果数据是嵌套的（如JSON对象），递归可以轻松处理多层结构。递归可以用于创建链式动画，例如依次淡入多个元素。
2025-08-19 08:23:54
142
原创 AJAX相关介绍
AJAX（Asynchronous JavaScript and XML）是一种用于创建异步 Web 应用程序的技术，允许在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。
2025-08-15 15:43:47
137
原创 jQuery获取元素方法
方法可以获取或设置表单元素（如 input、select、textarea）的值。符号可以根据元素的层级关系获取子元素或兄弟元素。符号加上元素的 ID 名称可以获取指定的元素。符号加上元素的类名可以获取所有匹配该类的元素。直接使用标签名可以获取所有匹配该标签的元素。方法可以获取或设置元素的 HTML 内容。方法可以获取或设置元素的 CSS 属性值。方法可以获取元素相对于文档的偏移位置。方法可以获取或设置元素的文本内容。方法可以获取或设置元素的属性值。方法可以移除元素的指定属性。等方法可以获取元素的尺寸。
2025-08-13 14:16:53
901
原创 JQuery遍历
map()` - 将集合中的每个元素传递给函数，构建包含返回值的jQuery对象。`parentsUntil()` - 返回介于两个元素之间的所有祖先元素。`nextUntil()` - 返回介于两个元素之间的所有后续同级元素。`prevUntil()` - 返回介于两个元素之间的所有前面同级元素。`find()` - 返回后代元素中匹配选择器的元素。`contains()` - 返回包含指定文本的元素。`parent()` - 返回至少有一个子元素的元素。`parents()` - 返回所有祖先元素。
2025-08-13 14:14:40
415
原创 JSDOM文档对象类型
JSDOM 是一个在 Node.js 环境中模拟浏览器 DOM 的库，允许在服务器端解析和操作 HTML 文档。它实现了 W3C DOM 标准，支持大部分浏览器 DOM API，常用于测试、爬虫或服务端渲染等场景。
2025-08-07 18:10:22
285
原创 JS对象的基本概念
JavaScript对象是一种复合数据类型，用于存储键值对的集合。对象可以包含属性和方法，属性是对象的特征，方法是对象的行为。JavaScript使用原型链实现继承，每个对象都有原型对象。浅拷贝只复制对象的引用，深拷贝创建完全独立的副本。ES6引入解构赋值语法，可以方便地从对象提取属性。属性可以通过点表示法或方括号表示法访问。对象属性可以动态添加、修改或删除。提供了一些实用方法用于操作对象。对象可以通过字面量、构造函数或。对象可以包含函数作为方法，使用。循环遍历对象的可枚举属性。关键字引用对象自身。
2025-08-07 18:08:37
227
原创 JS函数基础
JavaScript 函数是可重复调用的代码块，用于执行特定任务或计算值。通过灵活组合上述特性，可以构建复杂且高效的 JavaScript 代码逻辑。由调用方式决定，箭头函数继承外层。为参数提供默认值，避免未传参时的。以函数为参数或返回函数的函数，如。
2025-08-07 18:07:36
306
原创 什么是作用域
作用域的概念作用域（Scope）指变量、函数或对象在代码中的可访问范围。它决定了代码中哪些部分可以访问特定的标识符（如变量名）。作用域分为全局作用域和局部作用域，局部作用域又包括函数作用域和块级作用域（如 {} 内）。全局作用域示例变量在函数或代let globalVar = "全局变量";// 可访问全局变量// 输出 "全局变量"// 输出 "全局变量"码块外部声明时，属于全局作用域，可在整个程序中被访问。
2025-08-07 18:05:24
303
原创 JavaScript 流程控制语句
这些流程控制语句可以组合使用，构建出复杂的程序逻辑。JavaScript 提供了多种流程控制语句，用于控制代码的执行顺序和逻辑分支。3. 遍历数组优先使用 for...of 或数组方法(map, forEach等)6. 避免过深的嵌套，可以通过早期返回(early return)来简化代码。// 返回结果并终止函数执行。// 跳过当前迭代，继续下一次。// 匹配value1时执行。// 匹配value2时执行。for...of 循环 (ES6)// 循环体（至少执行一次）// 无论是否出错都会执行。
2025-08-02 20:00:11
431
原创 JavaScript 数组循环的方式
/ 检查是否都为正数。- `every` 检查是否所有元素都满足条件## 8. find 和 findIndex 方法 (ES6)- 需要查找元素：使用 `find` 或 `findIndex`- 需要检查数组元素：使用 `some` 或 `every`- 不能使用 `break` 或 `continue`- 需要索引或完全控制循环过程：使用 `for` 循环。- 需要对每个元素执行操作：使用 `forEach`- 简单遍历数组元素：使用 `for...of`- `some` 检查是否有元素满足条件。
2025-08-02 19:53:06
640
原创 css html定位
CSS 定位(Positioning)允许你控制元素在页面上的位置，主要通过 `position` 属性实现。4. sticky 定位需要指定至少一个阈值(top, right, bottom 或 left)才能生效。1. 使用 absolute 或 fixed 定位时，元素会脱离文档流，可能导致父元素高度塌陷。- 只对定位元素(position 非 static)有效。- 相对于最近的定位祖先元素(非 static)进行定位。2.2 relative (相对定位)2.4 fixed (固定定位)
2025-07-30 18:31:54
272
原创 css知识点
CSS（层叠样式表）是一种用于描述 HTML 或 XML 文档外观和格式的语言。通过使用 CSS，可以大大提高网页开发的效率和灵活性。通过掌握这些基本的 CSS 知识点，可以有效地控制网页的外观和布局，提高开发效率和用户体验。选择器用于选择需要应用样式的 HTML 元素。CSS 盒子模型用于描述元素的布局。：使元素向左或向右浮动，常用于图文混排。：直接使用元素的标签名，如。选择所有具有该类名的元素。：直接在 HTML 元素的。：用于创建灵活的响应式布局。，用于选择特定状态的元素。，用于精确控制元素的位置。
2025-07-30 18:17:14
225
原创 行内元素和块级元素的区别
块级元素适用于页面结构的布局，而行内元素通常用于文本样式的修饰。块级元素可以设置宽度、高度、外边距和内边距，并且可以包含其他块级元素或行内元素。默认情况下，块级元素的宽度为父容器的100%。行内元素的宽度和高度由内容决定，无法直接设置宽高属性。此外，行内元素只能包含文本或其他行内元素，不能包含块级元素。行内元素的特点是不会独占一行，它们只占据内容所需的宽度，多个行内元素可以在同一行内显示。属性，可以将行内元素转换为块级元素，或将块级元素转换为行内元素，从而灵活调整页面布局。
2025-07-24 14:25:21
223
原创 CSS哪些属性可以继承
浏览器默认字体大小16px,而body定义了字体大小(16px X 85% = 13.6px). 如果子元素没有指定字体大小13.6px这个值将被子元素继承。:一个属性定义了unset值，如果该属性是默认继承属性，该值等同于inherit，如果该属性是非继承属性，该值等同于initial。font-size是可以被继承的。但是它的方式有一些特别。Font-size的子类继承的不是实际值，而是计算后的值。由于浏览器默认字体大小是16px，而p定义了字体14px，所以em继承了p的字体大小属性，也是14px；
2025-07-23 17:19:02
1211
原创 HTML基础
- 适配移动设备 --><meta charset="UTF-8"> <!-- 字符编码（必选，避免乱码） --><html lang="zh-CN"> <!-- 根元素，lang指定语言 -->-- 浏览器标签页标题 -->-- 头部：元数据、样式、脚本等（不直接显示） -->-- 声明文档类型为HTML5 -->-- 主体：网页可见内容 -->
2025-07-16 18:11:03
217
原创 css基础
static（默认）、relative（相对自身）、absolute（相对最近非 static 父元素）、fixed（相对视口）、sticky（吸附定位）。容器属性：display: flex、flex-direction、justify-content、align-items。伪类/伪元素：:hover、:nth-child()、::before、::after。组合选择器：div p（后代）、div > p（子元素）、div + p（相邻兄弟）。/* 声明 */ }
2025-07-16 18:02:00
441
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人