popovertarget 是 html 中用于声明式触发 popover 的原生属性，可不用 js 实现后续显隐切换，但首次激活必须调用 showpopover() 初始化；需目标元素含布尔 popover 属性、id 严格匹配、且已执行过至少一次 showpopover()。
popovertarget 是什么，能不用 JS 吗？
popovertarget 是 HTML <button></button>、<input> 等可交互元素上的原生属性，用于声明“点击我，就显示/隐藏某个 <div popover>”。它确实支持零脚本触发——但前提是目标元素同时满足两个条件：<code>popover 属性存在，且已通过 showPopover() 或 hidePopover() 至少初始化过一次（哪怕在内联 onload 里调用也行）。
也就是说：纯静态 HTML（无任何 JS）无法首次激活 popover；但首次激活后，后续的 popovertarget 切换就完全不需要 JS 了。
怎么写才能让 popovertarget 正常工作？
关键不在按钮，而在目标 <div> 的状态和结构。必须确保：
<ul>
<li>目标元素有 <code>popover 属性（不是 popover="auto"，就是单纯 popover）
showPopover() 或 hidePopover()（哪怕只是瞬间 show 再 hide）<button></button>）的 popovertarget 值必须与目标元素的 id 完全一致（大小写敏感）display: none 或被 hidden 属性禁用（hidden 会阻断 popover 生命周期）示例最小可行结构：
<button popovertarget="mytip">悬停提示</button>
<div id="mytip" popover>这是弹出层内容</div>
<script>document.getElementById('mytip').showPopover();</script>
popovertarget 的三个取值分别干什么？
popovertarget 本身不接受值，但它配合 popovertargetaction 才完整。真正起作用的是后者，且只有三个合法值：
-
popovertargetaction="show"：点击即显示目标（如果已隐藏） -
popovertargetaction="hide"：点击即隐藏目标（如果已显示） -
popovertargetaction="toggle"：点击切换显隐（最常用）
注意：popovertargetaction 必须和 popovertarget 成对出现，否则无效；且该 action 只在目标已“注册为 popover”后才响应。
为什么点了没反应？常见静默失败原因
这种问题几乎从不报错，浏览器默默忽略。排查优先级如下：
- 目标元素缺失
popover属性（写成popover="manual"或popover="auto"都不行，必须是布尔属性） - 目标元素
id拼写错误，或含空格/特殊字符（只允许字母、数字、下划线、短横线） - 目标元素被父级
overflow: hidden截断，或 z-index 被压住（popover 默认 z-index 很高，但若父容器设了 transform 或 isolation，可能创建新层叠上下文导致遮挡） - 页面加载时未执行任意一次
showPopover()—— 这是最容易漏掉的硬性前提
Chrome 114+ 和 Safari 17.4+ 支持较稳；Firefox 当前（2024 中）仍需启用 dom.popups.enabled 实验标志，且不支持 popovertargetaction。
真要零 JS，目前唯一办法是把初始化脚本压进内联 <script></script> 并放在目标元素之后——没有更省事的路径。
