Javascript 基于CSS伪类获取内容

我有一个CSS声明如下：

span.boshbashbosh:nth-child(1):active:after {
  content: 'FC';
}

我试图通过以下方式访问内容（FC）：

var content = window.getComputedStyle(document.getElementsByClassName("boshbashbosh:nth")[0], '::active').getPropertyValue('content');
alert(content);

但是，警报只显示

正常

或

无

---

关于如何在纯JS中实现这一点，有什么建议吗？如果我有1000个，我不想单击/悬停每一个，有没有办法将一些代码转储到开发人员控制台中来实现这一点？

这里有一些问题，主要的问题是CSS选择器只会在用户单击交互期间返回一个活动元素，看到单击交互会导致目标元素变为

：活动的

考虑到这一点，您可以将登录名包装在如下所示的

mousedown

元素中，以提取所需的

内容

值，而相应的

span

元素为

：active

，如下所示：

document.addEventListener（“mousedown”，（）=>{
/*当鼠标按下occours时，查找我们要读取的元素
来自的伪内容*/
var元素=document.querySelector（“.boshbashbosh:n个子项（1）：活动”）；
if（元素）{
/*如果目标元素处于活动状态，请读取：：after的内容
伪元素*/
var content=window.getComputedStyle（元素“：after”）
.getPropertyValue（“内容”）；
警报（内容）；
}
})

span.boshbashbosh:n子级（1）：活动：之后{
内容：“FC”；
}
/*为了代码片段的清晰性/可用性而添加*/
跨度{
背景：粉红色；
保证金：1rem 0；
填充：1rem；
显示：块；
高度：1公厘；
}
span.boshbashbosh：激活{
背景：黄色；
}

单击第一个框会提醒：：after内容

这太好了-我将把它添加到问题中-但我需要在开发人员控制台中运行脚本，并让它提示/log。例如，如果有1000个元素，我就不想手动完成每一个了。你很受欢迎-因此你有数千个

boshbashbosh

span元素，你想将它们的psedoo

内容

记录到控制台？是的-基本上就是这样-console.log（）首先，但在某一点上，我希望构建一个字符串并向用户显示，但为了测试，console.log仅在元素

：active

时提供伪内容就足够了？或者可以删除

：active

？我不相信有什么方法可以用javascript直接调用

：active

，因为它不是我生成的，我无法控制它：-（这是否回答了你的问题？