javascript - 样式化事件元素的父对象

我的HTML看起来像这样：

<div>
    <span> content </span>
</div>

当我点击span时，我得到了一个:active伪类，以便可以对其进行样式设置。我的问题是，当孩子为div时，我想为父:active设置样式。

有没有办法使用CSS（我不这么认为）或JavaScript？

在回答之前要注意两点：


这个问题与此类似，除了这里的类不是普通的.active类，而是伪类:active。
提供的HTML只是示例HTML，我正在寻找一种通用的解决方案，该解决方案将适用于页面中的所有元素及其父元素（当它们处于活动状态时），而不仅仅是这些特定项目。因此，理想情况下，诸如带有$('span').click()调用的朴素.parent()处理程序之类的解决方案将无法理想地工作

最佳答案

您可以使用document.activeElement：

document.addEventListener("mousedown",function(){
    document.activeElement.parentElement.style.backgroundColor="red";
});

我注意到您没有包含jQuery标记，因此这是一种本机JS方法。

编辑：有趣的是，这行不通。为了您的目的，您可以简单地使用：

document.addEventListener("mousedown",function(e){
    e.target.parentElement.style.backgroundColor="red";
});

document.addEventListener("mouseup",function(e){
    e.target.parentElement.style.backgroundColor="";
});

参见演示here。我要问一个问题，然后就为什么前一个不起作用的问题再次与您联系。

关于javascript - 样式化事件元素的父对象，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/13322052/