关键在时机与方式：必须在DOM就绪后执行，用Array.from(new Set(arr)).map().join('')生成HTML再赋值innerHTML，避免直接赋Set对象或过早操作未加载元素。
用 Set 去重数组再渲染列表，关键不在“怎么写”，而在“什么时候写”
直接在 HTML 里写 new Set([...]) 是无效的——浏览器不执行 script 标签外的 JS 表达式。必须把去重逻辑放进 <script> 块，并确保 DOM 已就绪（比如放在 </body> 前，或监听 DOMContentLoaded）。
常见错误是：在元素还没加载完时就调用 querySelectorAll，结果拿到空 NodeList；或者把去重后的数组直接赋给 innerHTML 却没拼接 HTML 字符串。
- ✅ 正确时机：等
<ul id="list">真实存在于 DOM 中再操作 - ✅ 正确方式：用
Array.from(new Set(arr)).map(...).join('')构建 HTML 片段，再塞进innerHTML - ❌ 错误示范：
document.getElementById('list').innerHTML = new Set(['a','b','a'])→ 输出[object Set]
querySelectorAll 提取内容后，为什么还要 .trim().toLowerCase()
因为 strong、span 或自定义标签里的文本常带不可见干扰：首尾空格、换行、大小写混用。比如 <strong> React </strong> 和 <strong>react</strong> 经 innerText 取出后分别是 " React " 和 "react"，不标准化就会被 Set 当作两个不同值。
-
.trim()清掉前后空格和换行，避免"word "≠"word" -
.toLowerCase()统一大小写，避免"Vue"和"vue"被重复保留 - 若需保留原始格式（如首字母大写的专有名词），改用
Map存原始值：map.set(cleanKey, el.innerText)
渲染时用 innerHTML 还是逐个 appendChild？
对几十项以内的静态列表，innerHTML += '<li>...' 简单直接；但若后续要支持点击高亮、动态增删，用 appendChild 更可控——它不会重置已绑定的事件监听器，也不会清空子元素上的 data- 属性。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- ✅ 快速渲染（推荐初试）：
ulEl.innerHTML = listItems.map(item => `<li>${item}</li>`).join(''); - ✅ 动态交互场景：
listItems.forEach(text => { const li = document.createElement('li'); li.textContent = text; ulEl.appendChild(li); }); - ⚠️ 注意：
innerHTML = ...会销毁所有已有子节点，包括你手动加的 class、data 属性或事件监听器
为什么不用 filter((v,i,a) => a.indexOf(v) === i) 手写去重？
因为语义不清、性能差、易出错。这种写法对字符串数组尚可，但遇到对象数组就完全失效；且每次 indexOf 都要遍历前面所有项，时间复杂度 O(n²)。而 Set 是哈希表实现，插入和查重都是 O(1)，整体 O(n)。
-
new Set(arr)自动跳过 NaN、0 和 -0 的歧义（Set视0和-0相同，NaN和NaN相同） - 手写循环容易漏掉空字符串、
undefined或仅含空白符的项，Set不会自动过滤它们——所以标准化步骤（.trim()）必须前置 - 现代浏览器中
Set兼容性无压力（Chrome 51+、Firefox 53+、Safari 10.1+、Edge 15+）
真正容易被忽略的点是：去重不是目的，语义一致性才是。同一个词因 HTML 写法差异（<strong>JS</strong> vs <span class="keyword">js</span>）出现在不同标签里，querySelectorAll('strong') 就根本抓不到后者——这时候得先统一选择器，或改用正则从 innerHTML 中提取，而不是只盯着 Set 本身。
