不疯狂不成魔

│ │ ├── 细粒度响应式 (SolidJS, Vue 3 Composition)│ │ ├── 虚拟DOM+响应式 (Vue 2, React + MobX)│ │ └── 编译时响应式 (Svelte)│ └── 传统模板系统 (早期模板引擎)│ ├── 响应式组件系统 (Reactive)├── 声明式编程 (Declarative)│ └── 非响应式声明式。│ └── 声明式UI系统。

Content-Type是 HTTP 协议中最重要的头部之一，它告诉浏览器或客户端如何正确处理服务器返回的内容。Content-Type: 类型/子类型;让 JavaScript 正确处理数据。提高页面加载速度（某些类型有优化）避免 MIME 类型混淆攻击。确保文件正确下载/打开。让浏览器正确渲染页面。

方法名(回调函数(当前元素, 索引, 原数组), thisArg)这样坚持2-3周，就能形成肌肉记忆，不再需要临时查文档了！

a|b) 将匹配 a 或 b，但不会捕获结果。.test() 与.match（）不同，.test() 返回一个布尔值，指示字符串是否与模式匹配。字符串有一个 .match() 方法，它接受正则表达式作为参数并确定字符串是否与该表达式匹配。用 (a|b|c)​​ 匹配 ​​多个单词选项​​（如 hundred或 thousand）。​​用 [abc]​​ 匹配 ​​单个字符选项​​（如 [a-z]匹配任意小写字母）。g 全局匹配 (Global)，查找所有匹配项，而不是在找到第一个匹配项后就停止。

showAnimation（）函数中的所有代码都是逐行运行的，但由于setTimeout（）是异步的，free和Camp会立即记录到控制台，然后code会在一秒钟的延迟后记录到控制台。当你调用一个函数时，它会被添加到堆栈的顶部，而当它返回时，它会从堆栈的顶部/末尾被删除。由于希望在按下 Enter 键时执行操作，因此最有用的属性是 key，它会告诉你按下的键的字符串值。数组是堆栈结构，向其中添加新对象，该对象添加到堆栈顶部，或者换句话说，添加到数组的末尾。基本条件是函数停止调用自身的时候，最好先写出它。

本地存储是一种 web 浏览器功能，可让 web 应用程序在用户浏览器中持久存储键值对。这样，web 应用程序就可以在一次会话中保存数据，然后在以后的页面会话中检索这些数据。localStorage 学习如何处理表单输入、管理本地存储、对任务执行 CRUD（创建、读取、更新、删除）操作、实现事件监听器以及切换 UI 元素。LocalStorage 是 JavaScript 的一项网络存储功能，可让你通过将数据存储为 key:value 对来持久保存数据。

textContent是 JavaScript 中一个强大且高效的属性，适用于需要获取或设置元素完整纯文本内容的场景。它与 innerText的关键区别在于是否考虑CSS样式和元素的可见性。在大多数需要处理纯文本的情况下，尤其是对性能和安全性有要求时，textContent是推荐的选择。

这个 SVG 图标通过 path精准地描绘了一个向下箭头，是下拉框（）或自定义选择器组件中​​指示“可展开”状态的常见视觉元素​​。它的主要特点和优势包括：​​矢量图形​​：SVG 是矢量格式，可以无限缩放而不失真，在任何分辨率下都能保持清晰。

简单来说，​​undefined是 JavaScript 引擎告诉你“这里还没有值”的方式；而 null是你主动告诉 JavaScript 引擎“这里应该没有值”的方式​​。

使用元素的 style.display 属性，将属性的值设置为 “block” 或 “none”，可以显示或隐藏元素。要清除元素的内容，可以将 innerText 设置为空字符串。使用 innerText 属性来更新元素的内容。

在布尔上下文中，null 被认为是假的，在条件语句中其计算结果为 false。• ​​flags​​（可选）：跟在最后一个斜杠后面的标志（如 g、i、m等），用于修改匹配行为。在布尔上下文中，null 被认为是假的，在条件语句中其计算结果为 false。output 变量是一个元素，它具有 classList 属性，具有 .remove() 方法，接受一个字符串，表示要从元素中删除的类。在 JavaScript 正则表达式中，​​开头斜杠 /和结尾斜杠 /​​ 是正则表达式的​​字面量定界符​​，用于。

【代码】重学JS-003 --- JavaScript算法与数据结构（三）JavaScript 基础调试方法。

如果不想给一个变量分配一个新的值， 最好是使用 const 关键字来声明这个变量，而不是使用 let 关键字来声明这个变量。要解决此问题，将 script 元素移出 head 元素，并将其放置在 body 元素的末尾（就在结束标签 之前）。第一个是使用点符号。对象与数组类似，不同之处在于你不是使用索引来访问和修改其数据，而是通过属性来访问对象中的数据。开发者控制台将包含代码产生的错误，也可以使用它来查看代码中变量的值，这有助于调试。访问对象的属性有两种方式：点表示法（.）和括号表示法（[]），类似于数组。

函数 是可以在整个应用程序中重复使用的代码块。function 关键字告诉 JavaScript name 变量将是一个函数。parameter 是一个变量，表示在使用函数时传递给函数的值。一个函数可以具有任意数量的 参数。类似于 for 循环，花括号之间的空间是 函数主体。

这个选择器中间​​没有空格​​。它用于选择​​同时具有​​ arm和 left这两个类的​​同一个 HTML 元素​​。这个选择器中间有一个​​空格​​。空格在 CSS 选择器中表示​​层级关系​​（祖先与后代）。它会匹配所有​​作为 class="arm"的元素的后代元素​​中，那些 class="left"的元素。里面”​​：.arm .left表示“​​在​​ arm​​里面​​的 left元素”。​​无空格表示“和”​​：.arm.left表示“既是 arm​​又是​​ left的元素”。

简单来说，钩子就是一种​​“事件发生时，自动执行你预设函数”的机制​​。它通过​​解耦​​和​​事件驱动​​，让程序更​​灵活、易扩展​​。

这将按顺序设置 animation-name、animation-duration、animation-timing-function 和 animation-iteration-count 属性。在@keyframes规则中，您可以为动画序列中的特定点（如0%或25%）创建选择器，或者使用from和to定义序列的开始和结束。ease-in-out: 此设置将告诉动画以较慢的速度开始和结束，但在循环的中间移动得更快。这将使原点从左边偏移 0%，从上面偏移 0%，把它设置在元素的左上角。

• 使用 border-box后，元素的总宽度就是你设置的 width，​​内边距（padding）和边框（border）的宽度都会包含在 width和 height之内​​。::before和 ::after伪元素​​独立于它们所属的元素​​。• ​​语义化清晰​​：明确告诉浏览器、搜索引擎和辅助技术（如屏幕阅读器）这是引用的内容，有助于​​SEO优化​​和​​可访问性​​。• ​​与 <q>标签的区别​​：记住表格中的区别，​​短引用用 <q>​​，​​长引用用 <blockquote>​​。

• ​​作用​​：这个渐变​​从上到下​​（未指定角度时默认为 to bottom）定义了一个重复的渐变，很可能用于模拟​​建筑立面上的窗户​​或墙体的明暗效果。• 最下面 ​​10%​​ (100% - 90%) 的区域会由于重复渐变的特性，再次从 --building-color4 开始（可能表示窗户下方的墙体）。10%) 的区域是​​透明​​的。后 ​​5%​​ (15% -• ​​重复单元​​：每个重复单元的高度是整个背景高度的 ​​100%​​ (因为最后一个色标是90%，默认延伸至100%)。

:before 选择器创建一个伪元素，它是被选元素的第一个子元素，而 ::after 选择器创建一个伪元素，它是最后一个子元素的选定元素。•​​ 必须属性​​：::before和 ::after必须配合 content属性使用（即使为空 content: “”）。•​​ 语法​​：现代 CSS 推荐双冒号语法（如 ::before），但单冒号（如 :before）仍兼容旧版本浏览器。• ​​兼容性​​：部分伪元素（如 ::marker）需现代浏览器支持，旧版本需前缀或替代方案。

属性允许你在不改变布局或影响周围元素的情况下修改元素的形状、位置和大小。它具有 translate()、rotate()、scale()、skew() 和 matrix() 等功能。在 HTML 中，​​背景相关的 CSS 属性​​主要用于控制元素的背景样式，包括颜色、图片、渐变、位置、大小等。是一个属性，可以用来定义重叠的 HTML 元素的顺序。拥有较高 z-index 的任何元素总会位于拥有较低 z-index 的元素之上。属性设置或返回元素内的 HTML 内容。

CSS 伪选择器

head > <!-- 基础字符编码声明 --> < meta charset = " UTF-8 " > <!-- 视口设置，响应式设计必备 --> < meta name = " viewport " content = " width=device-width, initial-scale=1.0 " > <!-- 页面描述（SEO重要元素） --> < meta name = " description " content = " 这里是网页的简要描述，约150-160字符 " > <!

元素默认外边距（Margin）默认内边距（Padding）作用<h1>- <h6>上下 0.5em~1em无标题与内容分隔<p>上下 1em无段落间距<ul>/ <ol>上下 1em，左右 40px无列表缩进上下 1em，左右 40px无引用内容隔离<form>上下 1em无表单分隔<button>无上下左右 0.5em~1em按钮文字间距无上下左右 0.25em~0.5em输入内容间距<fieldset>上下 0.5em。

特性描述作用控制元素的宽度和高度如何计算，即是否将内边距和边框包含在内。​​取值​​content-box（默认值）：宽度和高度仅表示内容区域的尺寸；border-box：宽度和高度表示整个盒子的尺寸（包括内容、内边距和边框）。​​默认值​​​​常见用途​精确控制元素尺寸、简化布局计算、响应式设计、表单元素样式调整等。​​全局设置​​通常会在全局范围内设置 box-sizing: border-box;，以便统一盒模型的计算方式。

每个 HTML 元素都是一个盒子，它拥有着自己的间距和边框。这叫作“盒子模型”。

单位类型基准特点使用场景px绝对单位屏幕像素固定大小，精确控制图标、边框、固定尺寸元素vh相对单位视口高度基于视口高度，响应式设计友好全屏背景、高度动态调整vw相对单位视口宽度基于视口宽度，响应式设计友好全屏背景、宽度动态调整em相对单位当前元素或父元素的字体大小相对性较强，可能受嵌套影响字体大小、局部尺寸调整rem相对单位根元素（<html>）的字体大小 相对基准固定，易于控制全局字体大小、响应式布局。

根据在这里实践，记录笔记总结。

根据在这里实践，调整顺序后做的总结。

前端 html 复习。

复习前端知识，了解前端的原理。

问题产生原因由于数据传输的原因，有时我们得到的是字符串形式的数组（比如："[‘a’, ‘b’, ‘c’, ‘d’]"）。要将这种字符串还原成数组对象，有如下两种方法。解决方法1. 使用 eval() 函数转换（1）eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。我们可以借助它来将字符串还原成数组。var str = '["a", "b", "c", "d"]';var arr = eval('(' + str + ')');console.log("原始的字

js的执行是按需执行的，最好写在head或者body里面，如果写在其他地方，浏览器也会宽容的解释，但是不好js外部引入的需要注意编码

第一部分：javascript百度百科介绍1、JavaScript由Netscape公司的LiveScript发展而来的，是一种动态类型、弱类型、基于原型的译式客户端脚本语言。广泛用于客户端的脚本语言，用来给HTML网页增加动态功能。（跟Java没有关系）2、完整的JavaScript实现包含三个部分：核心（ECMAScript），文档对象模型（Document Object Mode