- 博客(107)
- 收藏
- 关注
RSS订阅原创 JavaScript正则表达式
正则表达式是处理字符串的利器，通过灵活组合字符匹配、量词、分组和断言，可解决复杂的文本处理需求。在 JavaScript 中，结合test()exec()replace()等方法，能高效实现数据验证、提取与转换功能。
2025-04-05 00:23:28
509
原创 JavaScript BOM核心对象、本地存储
JavaScript 提供了两种浏览器端存储方案，统称为类型生命周期作用域永久存储（除非手动清除）同源的所有标签页共享会话级存储（标签页关闭后清除）仅当前标签页有效共同特点存储键值对（Key-Value），键和值均为字符串。存储容量通常为5MB（不同浏览器可能略有差异）。仅限同源页面访问（同协议、域名、端口）。序列化必要：使用和JSON.parse处理复杂数据。容量管理：避免存储过大对象，必要时实现缓存淘汰策略。安全防护：加密敏感数据，避免 XSS 攻击导致数据泄露。版本控制。
2025-04-04 23:53:14
525
原创 JavaScript BOM、事件循环
对象核心功能典型用途window窗口控制、定时器、全局对象调整窗口大小、定时任务locationURL 操作与页面导航页面跳转、获取 URL 参数navigator浏览器/设备信息设备检测、地理位置获取history历史记录管理单页应用路由控制screen屏幕信息获取响应式布局适配本地持久化存储用户偏好设置、缓存数据单线程非阻塞：通过事件循环和任务队列实现异步。任务优先级：微任务 > 宏任务。避免阻塞：长时间同步代码会阻塞事件循环（如大量计算）。应用场景宏任务：延迟任务、I/O 操作。
2025-04-04 23:52:58
352
原创 JavaScript DOM 节点操作
是 HTML 或 XML 文档中每个独立单元的抽象表示。整个文档被建模为一个树形结构（DOM 树），其中每个节点对应文档的一部分（如元素、属性、文本等）。节点是 DOM 操作的基本单位，通过 JavaScript 可以动态访问和修改节点，实现页面交互。DOM 规范定义了多种节点类型，每个类型通过nodeType1<div><p>2389document11。
2025-04-03 21:47:02
772
原创 JavaScript页面事件与滚动
属性/方法用途适用场景scrollTopscrollLeft获取/设置元素滚动距离自定义滚动控制获取元素内容总尺寸（含溢出部分）判断是否可滚动或加载更多数据scrollX获取文档滚动距离（推荐替代页面滚动位置监听scrollTo()scrollBy()控制滚动位置（支持平滑滚动）导航到指定位置或动画效果属性/方法说明e.pageX/Y鼠标相对于文档左上角的坐标（含滚动偏移）鼠标相对于视口左上角的坐标（不含滚动偏移）鼠标相对于屏幕左上角的坐标文档当前水平/垂直滚动距离（等同于。
2025-04-02 00:02:01
1076
原创 JavaScript事件监听
，并将其作为参数传递给事件处理函数。该对象包含与事件相关的所有信息，例如触发事件的元素、事件类型、坐标位置、按键信息等。若回调函数引用外部变量或 DOM 元素，可能导致内存泄漏（需及时移除监听）。如果将函数 A 做为参数传递给函数 B 时，我们称函数 A 为回调函数。（可选）：配置对象或布尔值，控制捕获/冒泡阶段、一次性执行等。：用户或浏览器触发的动作，如点击、滚动、键盘输入等。：触发事件的元素（如点击的具体子元素）。事件触发后，相对应的回调函数会被执行。：阻止事件继续传播（冒泡或捕获）。
2025-03-31 18:16:40
781
原创 JavaScript定时器
场景推荐方案关键点简单周期性任务及时清理定时器，避免内存泄漏异步任务/耗时操作递归setTimeout确保任务完成后再调度动画/高频渲染匹配屏幕刷新率，减少卡顿复杂计算避免阻塞主线程组件内定时器生命周期钩子清理（如 React/Vue）防止组件卸载后定时器残留最佳实践优先使用箭头函数：避免this指向问题。递归setTimeout替代：解决任务堆积问题。严格管理定时器生命周期：在组件/页面销毁时清理。高频任务优化：合并操作或使用。
2025-03-31 18:16:26
822
原创 JavaScript函数详解
优先使用箭头函数除非需要动态this（如对象方法），否则箭头函数更简洁安全。避免过度嵌套使用或 Promise 链替代回调地狱。合理使用闭包注意内存泄漏（如无用的变量引用未被释放）。函数单一职责一个函数只做一件事，提高可测试性和可维护性。
2025-03-30 20:34:08
916
原创 JavaScript中的Math对象和随机数
浮点数运算可能存在精度问题，处理金额等敏感数据时建议转成整数计算。JavaScript 原生不支持种子随机数，需自行实现算法（如。区间内的浮点数（包含 0，不包含 1）。确保公式正确闭合区间（如。
2025-03-29 18:11:38
1052
原创 JavaScript运算符与逻辑中断
避免在复杂表达式中混用前置和后置形式，易引发歧义。：安全访问嵌套对象属性，避免因中间属性不存在而报错。：若左侧为假，直接返回左侧值，否则返回右侧值。：若左侧为真，直接返回左侧值，否则返回右侧值。：适合旧版默认值，但会覆盖假值（0、""）。时，直接返回左侧值，不再执行右侧。时，直接返回左侧值，不再执行右侧。，避免隐式类型转换导致的意外结果。时返回右侧值，否则返回左侧值。：现代默认值方案，精准处理。的场景（如权限检查）。（BigInt 零）
2025-03-29 18:11:26
959
原创 JavaScript数组和对象
目录JavaScript 数组详解一、数组的创建与基本特性二、数组核心操作1. 增删元素2. 截取与合并3. 查找与判断三、数组迭代与转换1. 迭代方法（不修改原数组）2. 排序与反转四、map与join1. map 方法2. join 方法3. map 与 join 联合使用四、ES6+ 新增方法五、性能优化与陷阱六、常见问题与解决方案JavaScript 对象详解一、对象的创建与基本特性1. 创建对象2. 键的特性3. 属性的特性（Property Attributes）二、对象操作1. 属性访问2.
2025-03-28 19:45:24
869
原创 JavaScript基础概念
JavaScript 是一种动态类型解释型的编程语言，主要用于网页交互，现也可用于服务端（Node.js）和移动应用开发。客户端脚本语言：在浏览器中执行，增强用户界面交互。解释执行：无需编译，由浏览器逐行解释。动态类型：变量类型在运行时确定，可随时更改。单线程与异步：通过事件循环处理异步操作（如 AJAX）。基于原型：使用原型链实现继承，而非传统的类继承（ES6 引入类语法糖）。变量选择：优先使用const，需要重新赋值时用let，避免var。输出调试：多用，少用alert()。代码位置。
2025-03-27 17:30:17
950
原创 CSS rem、vw/vh、less
1vw= 视口宽度的1%例如：视口宽度为1200px，则。1vh= 视口高度的1%例如：视口高度为800px，则。
2025-03-26 19:24:08
1082
原创 Css vertical-align与line-height
用于控制或的。（除非通过display转换为行内块或表格元素）。<span><img><input><button>等。<td><th>。的元素。：如，元素相对于基线向上或向下偏移。：基于元素的计算偏移量，如。<img>下方出现空隙。：图片默认对齐到基线（baseline），与父元素基线下的预留空间产生间隙。：设置的<div>未垂直居中。：块级元素默认，不支持。：多行文本或元素垂直对齐不一致。：统一设置或调整。控制行高，影响的基线位置。baselinedisplay用于控制：单行文字在容器内垂直居中。
2025-03-25 20:18:59
937
原创 CSS圣杯布局与双飞翼布局
经典布局的意义圣杯和双飞翼布局是早期 CSS 布局的经典解决方案，理解其原理有助于掌握 CSS 核心机制（如浮动、负边距）。面试中常被考察，体现对传统布局技术的理解。现代布局推荐优先使用Flexbox或Grid，代码更简洁、维护成本更低。仅在兼容旧浏览器时考虑传统方案。
2025-03-24 10:35:25
470
原创 CSS网格布局Grid
CSS Grid 是一种强大的二维布局系统，能够以行和列的方式精确控制网页布局。它比传统的布局方式（如浮动、定位）更灵活、更强大，适合构建复杂的响应式网页。当项目超出定义的网格范围时，浏览器会自动创建隐式网格。（行间距 20px，列间距 30px）。（最小 100px，最大 1fr）。是线性布局的终极解决方案，擅长处理。是二维布局的革命性工具，擅长构建。（重复 3 列，每列宽度相等）。：定义行和列之间的间距（替代。（行和列间距均为 10px）。（从第 1 列到第 3 列）。：所有项目的水平对齐方式（
2025-03-24 10:35:18
913
原创 CSS动画
CSS 动画允许通过定义关键帧（@keyframes）和动画属性（animation）实现复杂的动态效果，相比transition更灵活，支持多阶段控制和循环播放。
2025-03-23 15:16:17
847
原创 CSS空间转换
属性作用示例值定义 3D 元素的视距1000px子元素保留 3D 位置调整视角位置top left控制元素背面是否可见hiddenrotate3d()绕自定义轴旋转。
2025-03-23 15:14:28
693
原创 CSS平面转换
转换类型函数核心作用常用场景平移移动元素位置微调布局、动画位移旋转rotate()改变元素角度图标旋转、卡片翻转缩放scale()调整元素大小悬停放大、焦点突出倾斜skew()倾斜元素形状斜切设计、动态变形转换原点定义变换基准点绕特定点旋转、自定义缩放中心。
2025-03-22 01:30:13
1265
原创 CSS中的transition与渐变
线性渐变：适用于水平/垂直/对角线颜色过渡。径向渐变：适合圆形/椭圆发光、光斑效果。圆锥渐变：专为色轮、角度指示设计。重复渐变：创建条纹、网格等重复图案。组合使用：可叠加多渐变或与图片混合，实现复杂视觉效果。
2025-03-22 01:30:05
915
原创 CSS浮动布局和Flex布局
标准流（Normal Flow）是浏览器默认的布局方式，元素按照 HTML 的书写顺序从上到下、从左到右排列，遵循。
2025-03-21 00:44:44
749
原创 CSS定位、图标与修饰属性
目录一、定位方式（Positioning）1. 相对定位（position: relative）2. 绝对定位（position: absolute）3. 固定定位（position: fixed）4.定位居中二、堆叠顺序（z-index）三、CSS 精灵（CSS Sprites）四、字体图标（Icon Fonts）五、修饰属性1. 透明度（opacity）2. 光标类型（cursor）示例1：示例2：作用：相对于元素自身原始位置进行偏移，不脱离文档流。属性： / / / ：偏移距离。示例：
2025-03-21 00:44:33
710
原创 CSS盒子模型
父子级的外边距塌陷是 CSS 中常见的布局问题，当父元素和第一个（或最后一个）子元素的垂直外边距直接接触时，浏览器会将两者的外边距合并（取最大值），导致父元素和子元素一起移动。它是一个独立的渲染区域，内部元素的布局不会影响外部元素，反之亦然。：上下相邻的两个块级元素，及相邻的兄弟元素，它们的垂直外边距会合并。：父子级的标签，子级添加上外边距会产生塌陷问题，导致父级一起向下移动。：父子元素均未脱离文档流（非浮动、非绝对定位）。：仅发生在垂直（上下）外边距之间。：阴影扩展（可选，默认 0）。
2025-03-20 00:44:40
949
原创 CSS选择器
结构伪类选择器根据元素在文档树中的位置或结构关系进行选择。伪元素选择器用于在元素内容前后插入虚拟元素或修饰特定部分。：选择父元素的第 n 个子元素（正向或逆向计数）。：选择同类型元素中的第 n 个（正向或逆向计数）。伪类选择器用于定义元素的特定状态或结构位置。：选择紧接在前一个元素后的第一个兄弟元素。：选择所有嵌套在祖先元素内的后代元素。：选择父元素的第一个或最后一个子元素。：选择前一个元素之后的所有同级元素。：选择作为父元素唯一子元素的元素。：元素获得焦点时（如表单输入）。：选择父元素中唯一类型的元素。
2025-03-17 00:11:34
1094
原创 CSS引入方式、字体与文本
CSS（层叠样式表）是用于描述网页外观和格式的核心技术。CSS基本结构选择器 {属性: 值;属性: 值;选择器：定位HTML元素（如p.class#id属性和值：定义样式规则（如color: red;优先使用外部样式表样式与结构分离，便于维护和复用。利用浏览器缓存提升性能。避免滥用内联样式内联样式优先级高，难以覆盖，且不利于维护。慎用 @import推荐使用<link>标签替代@import，避免阻塞渲染。模块化 CSS将样式按功能或组件拆分为多个文件，通过<link>引入。u。
2025-03-17 00:11:21
711
原创 HTML基础
什么是 HTML？HTML 是一种用于创建网页结构的标记语言，通过标签（Tag）定义内容的结构和呈现方式。浏览器解析 HTML 文档后，将其渲染为可视化网页。
2025-03-11 20:48:52
913
原创 Docker详解
容器是一种轻量级的虚拟化技术，用于将应用程序及其依赖环境打包在一起，形成一个独立的运行单元。容器共享宿主机的操作系统内核，但拥有独立的文件系统、网络和进程空间。容器的主要特点是轻量、快速、可移植。1. 环境一致性问题：开发、测试、生产环境差异导致「在我机器上能运行」问题。解决：容器将应用代码、依赖库、配置文件等打包成镜像，确保跨环境一致性。示例：开发人员在本地构建镜像后，测试和生产环境可直接运行同一镜像，避免环境差异导致的故障。2. 资源高效利用传统虚拟机。
2025-03-01 16:25:27
1155
1
原创 使用git上传和下载项目
在GitHub仓库页面点击“Download ZIP”，解压即可（无需Git）。登录GitHub，点击右上角“+” → “New repository”。打开GitHub项目页面，点击绿色“Code”按钮。：检查URL协议（HTTPS需密码，SSH需密钥）。如果还没有 GitHub 账号，请先注册一个。填写仓库名称，选择公开或私有，然后点击。登录 GitHub，点击右上角的。初始化README（避免冲突）。文件，列出需排除的文件/目录。如果尚未安装 Git，请从。填写仓库名，选择公开/私有，
2025-02-24 12:20:28
683
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人