safari 10完全不支持details的open属性，其dom setter/getter未实现，读写均静默忽略；直至safari 15.4才部分支持，但存在动画缺失及ios 15.4前忽略html中open属性等问题。
不支持。 Safari 10（2016年发布）完全不支持 open 属性，哪怕写上 <details open></details>，页面加载后仍默认收起，且无法通过 JS 设置 detailsElement.open = true 触发展开。
如何验证 Safari 10 是否忽略 open 属性
直接在 Safari 10 环境中运行以下代码即可确认：
const d = document.createElement('details');
d.open = true;
document.body.appendChild(d);
console.log(d.open); // 输出 false
这个结果说明：DOM 属性读写被静默忽略，不是“未生效”，而是根本没实现该属性的 setter/getter。
- Safari 直到 15.4 才开始部分支持
open（但仍存在动画缺失、iOS 15.4 前强制忽略 HTML 中的open属性等问题） - 所有 Safari 10–15.3 版本均无例外，包括 macOS 和 iOS 上的对应版本
- 不要依赖
getComputedStyle或 class 切换来判断状态——open属性本身不可读写，状态只能靠手动维护一个布尔变量
替代方案：用 JS 模拟 open 行为
当必须兼容 Safari 10 时，不能依赖原生 open，得自己控制显隐逻辑：
- 移除所有
open属性和相关 HTML 标记，改用data-open="true"或 class（如is-open）做状态标记 - 用
summary的 click 事件 +details内容区域的max-height过渡或display切换来模拟展开/收起 - 如果内容区含动态脚本（比如内嵌图表），记得在收起时用
innerHTML = ''清空，避免残留事件监听器或内存泄漏
为什么不能只靠 CSS 强制显示？
有人试过给 details[open] > *:not(summary) 加 display: block，但在 Safari 10 下无效，因为：
- 浏览器根本不识别
[open]这个属性选择器——它连open属性都不解析 -
<summary></summary>在 Safari 10 是 inline 元素，容易换行错乱，需额外加display: block和outline: none防焦点样式干扰 - 即使强行显示内容区，也无法同步控制 summary 的箭头方向（Safari 10 不支持
::marker，也无 JS API 可查当前状态）
真正麻烦的不是“怎么让它展开”，而是“怎么让所有旧 Safari 都有一致的状态反馈和可访问性”。open 属性从设计上就不是渐进增强友好型，一旦目标环境包含 Safari 10–15.3，就得整套重写交互逻辑，不能只补一两个 CSS 规则或一行 JS。
