关于display: none的DOM状态与事件响应的技术疑问

我对display: none属性存在困惑：

• 网上诸多文章称，当元素的display属性设置为none时，该元素不在DOM树中，这是它与opacity: 0、visibility: hidden的区别——后两者不会将元素从DOM中移除，仅使其不可见。相关说法示例：

  因为display: none实际上会将元素从DOM中移除，而visibility: hidden仅使元素不可见，但元素仍存在于DOM中。
  这是一个重要细节，因为使用display:none时，你实际上是将元素从DOM中移除了。

• 我还看到有说法称：

  浏览器不会对设置了display: none或visibility: hidden的元素的任何事件作出响应。

但在React中，我给某个元素设置ref后将其display属性设为none，仍能在开发者工具中看到该元素，还可通过ref调用它的点击事件。我也不理解display: none作为CSS属性为何能操作DOM。

我认为设置display: none的元素仍在DOM中只是不渲染，但想确认其事件响应情况。

内容的提问来源于stack exchange，提问作者forty5