为什么 Safari 在点击后不将 `<button>` 设置为 `document.activeElement`？

Question

这个简单的代码

<button onclick="console.log(document.activeElement)">
  console.log(document.activeElement)
</button>

在 Chrome 和 Firefox 中记录 <button>，但 Safari 出于某种奇怪的原因没有将焦点设置在 <button> 上并记录 <body>

Safari 有什么问题？我的期望是单击按钮应该使其聚焦。

Safari 版本：macOS 11.4 上的 14.1.1（最新）

Answer 1

mdn 页面上有关于活动元素的信息：

Which elements are focusable varies depending on the platform and the browser's current configuration. For example, on macOS systems, elements that aren't text input elements are not typically focusable by default.

这意味着在 Safari 中，您的按钮可能不符合可以成为 .activeElement 的条件。

这个问题更详细地说明了您的问题：

Answer 2

虽然 <button> 是可聚焦元素，但在 macOS Safari/Firefox 中单击它后不会获得焦点：

这似乎是有意为之，不会更改。在这里阅读更多：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#clicking_and_focus

为什么 Safari 在点击后不将 `<button>` 设置为 `document.activeElement`？

Why Safari doesn't set `<button>` as `document.activeElement` after clicking it?

html

javascript

safari

focus

onclick