推荐答案
Select 在HTML中使用哪个标记不仅仅是一个语义问题.许多元素也有内置的行为，这也是在JavaScript中的元素上公开的.虽然可以通过像role这样的属性来控制元素的语义，但这并不会改变它们的实际行为.
在Popover API的情况下，有一个限制，即只有<button>和<input>个元素能够具有popovertarget属性.MDN's page on the Popover API个人记录了这一点.
像往常一样，可以使用无效的标记编写HTML，但浏览器会忽略这些标记.类似于如果您try 将href属性添加到<p>标记上，它将不会变成链接.
在使用role来更改元素的语义时，您应该非常仔细和谨慎地考虑，而不是从一开始就只使用适当的元素.在这个使用<div>的示例中，您应该使用<button>，但您失go 了几个内置到按钮中的功能，例如能够接收键盘焦点，以及将某些按键视为"单击"事件.对于使用键盘而不是鼠标等指针设备的人来说，这些是非常重要的辅助功能，例如，因为他们可能是盲人或有运动障碍.
可以通过提供元素tabindex="0"和添加事件侦听器来处理这些键盘事件等方法来复制这些事件，但只使用<button>要容易得多.如果问题仅仅是样式的问题，根据我的经验，当人们避免使用<button>元素来处理真正应该使用的元素时，通常就是这种情况，最好通过css来解决这个问题.
如果您也是如此，那么您可能有兴趣了解一下unsetcss属性，它现在是supported by all modern browsers，可以更容易地对按钮应用"从头开始"的样式.