当javascript

Question

我有一个网站，在CSS中为支持悬停的浏览器定义了：hover。 CSS .has_hover a:hover {color:red;}位于标头中，而javascript位于</body>标签之前。

var canHover = !(matchMedia('(hover: none)').matches);   
if (canHover) {
  document.body.classList.add('has_hover');
}

在Safari（OS X 10.11.6上的v11.1.2）中，悬停功能会间歇性地工作（适用于所有链接或没有链接）。如果右键单击链接，则悬停将仅针对该链接开始工作。如果检查了页面，并且在开发工具中将：hover应用于任何链接，则悬停将开始对所有链接起作用。如果我调整窗口大小，则悬停将开始对所有链接起作用。

我认为将类添加到body标签时与javascript时间有关。通过延迟javascript代码的执行，我已经能够在CodePen中复制此问题。

https://codepen.io/ejg/pen/LaNEXK

有什么方法可以强制Safari识别：hover而无需重新呈现页面？