-
float用于让元素脱离文档流并左/右移动，实现文字环绕图片效果；2.它会引发父容器高度塌陷问题，需通过clear属性、overflow触发BFC或clearfix伪元素法清除浮动；3.尽管现代布局多用Flexbox/Grid，float仍适用于图文混排、简单多列及兼容性要求高的场景，是维护旧项目必备技能。
-
localStorage是持久化存储机制，即使关闭浏览器数据也不会丢失。它通过setItem、getItem等方法操作字符串数据，存储对象需先用JSON.stringify转换，获取时用JSON.parse解析。区别于sessionStorage，localStorage数据长期存在，适合存储用户偏好设置，而sessionStorage仅在当前会话有效，适合临时数据。使用时需注意：存储容量有限（约5MB），不适合存敏感信息，同步操作可能影响性能，且受同源策略限制。判断是否支持localStorage可通过
-
本文旨在解决使用JavaScript控制菜单显示时，点击事件无法正确触发的问题。通过将JavaScript代码放置在DOMContentLoaded事件监听器中，确保在DOM加载完成后再执行相关操作，从而避免因元素未加载而导致的事件绑定失败。文章将提供详细的代码示例和解释，帮助开发者理解并解决类似问题。
-
align-items是Flexbox布局中控制子元素在交叉轴上对齐方式的属性。1.它需在display:flex容器中使用；2.常用值包括flex-start（起始对齐）、flex-end（结束对齐）、center（居中）、baseline（基线对齐）和stretch（拉伸填充）；3.其作用方向取决于flex-direction，主轴为水平时控制垂直对齐，反之则控制水平对齐；4.与justify-content（主轴对齐）配合使用可实现完整布局；5.实际应用中需注意设置容器高度、区分align-cont
-
JavaScript筛选功能的核心是根据条件过滤数据并更新页面展示。首先从数据源（如数组）出发，监听用户输入或选择操作，利用filter()方法按条件（如名称、分类）筛选数据，最后通过DOM操作渲染结果。支持多条件组合时，应基于原始数据依次应用各条件，确保逻辑清晰。为提升性能，可使用防抖减少高频触发的计算压力；数据量大时考虑优化结构或引入搜索库。筛选无结果时，应提供明确提示、保留搜索词、给出改进建议，并通过UI设计增强可读性，从而全面提升用户体验。
-
优化希腊文字间距需以letter-spacing为核心工具，结合视觉判断进行迭代调整；2.因希腊文存在变音符号、独特字符形状及阅读习惯，其排版需特别处理以提升可读性与美观度；3.使用letter-spacing时建议从微小负值如-0.02em或-0.5px开始，优先选用em/rem等相对单位以增强响应性，并在不同设备与浏览器中反复测试；4.标题与正文应采用不同策略，大字号标题通常需更紧凑间距，正文则需保持呼吸感；5.字体选择至关重要，应优先选用支持“GreekExtended”或“PolytonicGre
-
HTML5的<time>元素通过datetime属性将人类可读时间转换为机器可读的标准化格式，提升数据精度与互操作性。1.datetime属性必须遵循ISO8601标准，如YYYY-MM-DD或HH:MM，并可包含时区信息（如+08:00或Z）；2.可表示持续时间，如PT2H30M代表2小时30分钟；3.使用<time>有助于SEO优化、无障碍访问和应用程序间的数据同步；4.常见错误包括格式不规范以及时区信息缺失，应避免歧义确保全球一致性。
-
选择HTML颜色代码可通过专业工具与色彩理论结合提升效果，推荐使用AdobeColor生成和谐配色并导出CSS代码；Coolors适合快速随机生成配色方案并锁定特定颜色；Paletton提供精细调整功能，支持基于主色调创建多种风格配色；ColorHunt汇集大量精选配色供直接选用；MaterialDesign工具专为MaterialDesign风格设计自动生成规范配色。同时应结合色彩心理学选择颜色，如蓝色传递信任，绿色象征自然，黄色表现活力，红色用于警示，紫色体现高贵。避免配色错误需控制颜色数量、确保对比
-
window对象是BOM的核心，作为JavaScript与浏览器交互的入口，它代表浏览器窗口并承载所有全局变量及BOM其他对象。1.它提供了访问浏览器功能的接口，如获取视口尺寸（innerWidth/innerHeight）、控制滚动（scrollTo/scrollBy）、管理定时器（setTimeout/setInterval）、弹出对话框（alert/confirm/prompt）、操作窗口（open/close）、访问其他BOM对象（document、location、navigator等）以及本地
-
掌握WebCodecsAPI需了解音视频编码及JS技巧，1.复用解码器并动态配置；2.编码器动态调整码率；3.使用EncodedVideoChunk/EncodedAudioChunk封装数据；4.处理音频采样率与声道布局；5.VideoFrame的copyTo高效图像处理；6.结合WebTransport实现低延迟传输。兼容性方面Chrome/Edge支持较好，调试可用开发者工具、控制台输出和chrome://media-internals。性能优化包括实例重用、合理配置参数、WASM加速、减少内存分配
-
object标签的核心作用是作为通用容器嵌入多种外部资源，如PDF、SVG等，支持备用内容实现优雅降级；2.与iframe和embed的区别在于：object语义更强且支持多类型媒体和备用内容，iframe用于嵌入独立HTML文档并提供隔离上下文，embed则依赖插件、无备用内容，现代开发中已基本淘汰；3.实际应用场景包括嵌入PDF、高级交互SVG、非标准格式文件及作为HTML5媒体标签的备用方案；4.使用时需注意兼容性问题（插件依赖、MIME类型匹配、移动端支持）和安全风险（XSS、点击劫持、资源消耗）
-
<p>用CSS制作环形数据仪表盘的核心是利用conic-gradient和CSS变量结合数学公式实现动态效果。1.创建一个圆形容器并使用conic-gradient根据CSS变量--value设置颜色分布，红色部分表示进度，浅灰色表示剩余部分；2.添加指针元素，通过transform:rotate(calc(var(--value)*3.6deg))使其旋转对应百分比角度，transform-origin设置旋转基点；3.使用JavaScript动态设置--value变量来更新仪表盘进度，如7
-
使用<mark>标签可直接实现文本高亮，如<p>这是一个包含<mark>重点内容</mark>的段落。</p>；2.通过CSS可自定义<mark>样式，如设置background-color和color，或为<mark>添加class以应用不同样式；3.其他高亮方法包括使用<span>标签结合内联或外部CSS、JavaScript动态高亮文本内容，以及使用::selection选择器改变用户选中文本的样式；4.
-
WeakMap和WeakSet的主要作用是存储弱引用对象，避免内存泄漏。当对象仅被WeakMap或WeakSet引用时，仍可被垃圾回收机制回收，而Map和Set的引用会阻止对象被回收。例如，将对象设为null后，若仅被WeakMap引用，则该对象可被回收。适用WeakMap的场景包括：1.存储私有数据或元数据，如记录DOM元素状态而不污染属性；2.缓存对象相关数据，如组件状态或计算结果，对象销毁后缓存自动释放；3.观察或监听对象行为，判断对象是否仍在使用中。WeakSet适用于：1.标记对象是否已处理过；
-
链式调用通过每个方法返回this实现，使后续方法可继续调用；2.闭包使方法能访问并维护私有状态\_query，确保数据封装与安全；3.实际使用中需始终返回this、避免链条过长、提供build等终止方法、确保方法职责单一、命名清晰、利用TypeScript增强类型安全，从而实现高效且可维护的链式调用。
