如何通过Javascript更改伪的内容值：在元素之前
我有CSS构建的grap，它由JS动态更改。 我用伪元素显示图形最大值为：
.graph:before { content:""; //value that want set by JS position:absolute; top:0; left:0; } 这就是我需要通过JS设置这个值的原因。 我试过$(".graph:before").css("content", hh); 但它没有帮助。 如何获得这个价值？
更新（2018年） ：正如评论中所述，您现在可以这样做。
您不能通过JavaScript修改伪元素，因为它们不是DOM的一部分。 最好的办法是在CSS中使用您需要的样式定义另一个类，然后将其添加到元素中。 既然你的问题似乎不可能，那么你可能需要考虑使用真正的DOM元素而不是伪元素。
我希望下面的代码片段可能会有所帮助，您可以使用CSS attr()函数通过JS指定所需的content值。
JavaScript的：
$('.graph').on('click', function () { //do something with the callback $(this).attr('data-before','anything'); //anything is the 'content' value });
CSS：
.graph:before { content: attr(data-before); //value that that refers to CSS 'content' position:absolute; top: 0; left: 0; }
那些仍在寻找相同问题解决方案的人，使用jQuery可以实现如下：
此示例说明在单击按钮： changeBefore ， .graph:before的值将根据新的动态即将到来的值进行更改。
有关更改:before或:after元素样式或获取其内容的更多说明：
让我们假设你的HTML是这样的：
Test
然后你设置它：在CSS之前设计它：
#something:before{ content:"1st"; font-size:20px; color:red; } #something{ content:'1st'; }
请注意我还在元素本身中设置了content属性，以便您以后可以轻松地将其取出。 现在有一个button点击，你想要改变颜色：before到green，它的font-size为30px。 您可以按如下方式实现：
在某个类上定义一个具有所需样式的css .activeS ：
.activeS:before{ color:green !important; font-size:30px !important; }
现在，您可以在样式之前更改：将类添加到：before元素，如下所示：
如果您只想获得以下内容:before可以将其作为：
我希望它有所帮助
您可以使用CSS变量
:root { --h: 100px; } .elem:after { top: var(--h); } let y = 10; document.documentElement.style.setProperty('--h', y + 'px')
我相信有一个简单的解决方案，使用attr（）函数来指定伪元素的内容。 这是一个使用’title’属性的工作示例，但它也适用于自定义属性：
document.getElementById('btn_change1').addEventListener("click", function(){ document.getElementById('test_div').title='Status 1'; }); document.getElementById('btn_change2').addEventListener("click", function(){ document.getElementById('test_div').title='Status 2'; });
#test_div { margin: 4em; padding:2em; background: blue; color: yellow; } #test_div:after { content:attr(title); background: red; padding:1em; }
The element to modify