如何通过JavaScript更改伪类样式？
为了简单起见，这个例子只是我需要做的一个例子。 比如说，我有一个元素，它的样式是在CSS中设置的。为元素以及伪类（比如element:hover）设置样式。我可以使用以下JavaScript覆盖元素的样式： element.style.setProperty（'property-name'，'newvalue'，''）。 如何通过JavaScript更改伪类的样式 多谢各位如何通过JavaScript更改伪类样式？,javascript,html,css,pseudo-class,Javascript,Html,Css,Pseudo Class,为了简单起见，这个例子只是我需要做的一个例子。 比如说，我有一个元素，它的样式是在CSS中设置的。为元素以及伪类（比如element:hover）设置样式。我可以使用以下JavaScript覆盖元素的样式： element.style.setProperty（'property-name'，'newvalue'，''）。 如何通过JavaScript更改伪类的样式 多谢各位 <html> <head> <style type='text/css'>
<html>
<head>
<style type='text/css'>
#myBtn {
background-color: red;
}
#myBtn:hover {
background-color: blue;
}
</style>
</head>
<body>
<button id='myBtn'>Colored button</button>
<button onclick="ChangeColor();">Script button</button>
<script type="application/x-javascript">
function ChangeColor() {
var Btn = document.getElementById('myBtn');
Btn.style.setProperty('background-color', 'green', '');
};
</script>
</body>
</html>
#myBtn{
背景色：红色；
}
#myBtn：悬停{
背景颜色：蓝色；
}
彩色按钮
脚本按钮
函数ChangeColor（）{
var Btn=document.getElementById（'myBtn'）；
Btn.style.setProperty（'background-color'，'green'，''；
};
某些动态伪类，如
：hoveronmouseover-onmouseout<html>
<head>
<style type='text/css'>
#myBtn {
background-color: red;
}
#myBtn:hover {
background-color: blue;
}
#myBtn.changed {
background-color: green;
}
#myBtn.changed:hover {
background-color: yellow; /* or whatever you want here */
}
</head>
#myBtn{
背景色：红色；
}
#myBtn：悬停{
背景颜色：蓝色；
}
#myBtn{
背景颜色：绿色；
}
#myBtn.已更改：悬停{
背景色：黄色；/*或任何您想要的颜色*/
}
<script type="application/x-javascript">
function ChangeColor() {
var btn = document.getElementById('myBtn');
btn.className = "changed";
};
</script>
函数ChangeColor（）{
var btn=document.getElementById（'myBtn'）；
btn.className=“已更改”；
};
当然，这只适用于一个或几个不同的颜色值。您不能直接修改它们，但可以将CSS插入DOM的头部部分 您可以修改IE6+和大多数其他浏览器中的现有样式表 编辑现有规则是可能的，但需要复杂的跨浏览器操作 本例向文档中的最后一个样式表添加新规则（选择器和声明）
function addCss(sel, css){
S= document.styleSheets[document.styleSheets.length-1];
var r= (S.cssRules!= undefined)? S.cssRules: S.rules;
if(S.insertRule) S.insertRule(sel+'{'+css+'}',r.length);
else if(S.addRule)S.addRule(sel,css,r.length);
}
addCss('button:hover','background-color:blue;');
这并不完全正确-JavaScript当然可以创建一个覆盖CSS的新的