HTML中不能直接使用Set.intersection()，因为HTML是标记语言不执行JS逻辑；该方法是ES2024静态API，须在中调用，且仅Chrome 120+/Safari 17.4+支持，旧版需手写filter+has兼容。
HTML 本身没有 Set.intersection() 方法——这是 JavaScript 的 API，必须在 JS 环境中调用，不能直接写在 HTML 标签里当属性或内联表达式用。
为什么直接写 Set.intersection() 在 HTML 里会失败
HTML 是标记语言，不执行逻辑运算。像 Set.intersection() 这样的方法属于 ES2024 新增的静态方法（需浏览器支持），只能在 <script></script> 块或模块中调用。常见错误包括：
- 在
onclick或data-*属性里硬塞new Set([1,2]).intersection(new Set([2,3]))→ 浏览器报Uncaught SyntaxError或静默忽略 - 误以为类似 Vue/React 的模板语法能运行原生 JS 方法 → 实际只是字符串插值，不求值
- 没检查浏览器兼容性，
Set.intersection()在 Safari 17.4+、Chrome 120+ 才稳定支持，旧版会抛TypeError: Set.intersection is not a function
正确做法：在 <script></script> 中调用 Set.intersection()
先创建两个 Set，再用静态方法计算交集，结果仍是 Set。注意它不修改原集合，且只接受一个参数（另一个集合）：
const setA = new Set([1, 2, 3]);
const setB = new Set([2, 3, 4]);
const intersection = Set.intersection(setA, setB); // ✅ 正确：传两个 Set
console.log(intersection); // Set {2, 3}
如果需要转成数组或渲染到页面，得手动转换：
-
[...intersection]→ 得到[2, 3] -
Array.from(intersection)→ 同上，更显式 - 更新 DOM：
document.getElementById('result').textContent = [...intersection].join(', ')
兼容性 fallback：手写交集逻辑（IE / 旧版 Safari 必须用）
若目标环境不支持 Set.intersection()，别依赖 polyfill（目前无主流库提供可靠实现），直接用 filter + has：
const setA = new Set([1, 2, 3]); const setB = new Set([2, 3, 4]); const intersection = new Set([...setA].filter(x => setB.has(x))); // ✅ 兼容所有支持 Set 的环境
这个写法性能略低（O(n+m) vs 原生方法的潜在优化），但语义清晰、无兼容风险。别用 for...of 手动循环——没必要增加代码体积。
真正容易被忽略的是：交集结果是新 Set，不是数组；如果后续要排序或去重处理，得先转数组。另外，Set.intersection() 只接受 Set 实例，传 Array 或 Map 会直接报错，别想当然传参。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
