Jquery 如何在运行时操作CSS

我有三个单选按钮1）左，2）右3）无

所以当我将鼠标悬停在单选按钮上时，我会显示以下3个div，每个div都有不同的CSS

#popupdiv img {
    float: right;
    clear: right;
    margin: 15px
}

#popupdiv img {
    float: left;
    clear: left;
    margin: 15px
}

#popupdiv img {
    float: random; //i want the image to be display randomly in the div
    clear: random;
    margin: 15px
}

<div id='popupdiv'>
    <img src='http://www.hostname.com/images/a.jpg' width='100' height='100' border='0' />
    <img src='http://www.hostname.com/features/b.jpg' width='100' height='100' border='0'/>
    <p>same text for all three divs.....
</div>

#popupdiv img{
浮动：对；
清楚:对,；
利润率：15像素
}
#popupdiv img{
浮动：左；
清除：左；
利润率：15像素
}
#popupdiv img{
float:random；//我希望在div中随机显示图像
清晰：随机；
利润率：15像素
}
所有三个div的文本相同。。。。。

---

我想做的是使用一个div并根据用户悬停在哪个单选按钮上更改css。我如何做到这一点？

您要做的是为每种样式设置不同的类。即：

#popupdiv.left {...}
#popupdiv.right {...}
#popupdiv.random {...}

然后，当您将鼠标悬停在单选按钮上时，只需更改div上的class（）属性，以匹配所需的任何属性

示例HTML：

<form id="formid">
<input type="radio" value="left" name="pos_button" id="left_button"> 
<input type="radio" value="right" name="pos_button" id="right_button">
<input type="radio" value="random" name="pos_button" id="random_button">
</form>

---

我之所以使用DOM节点的“className”属性，是因为默认情况下jQuery提供removeClass和addClass方法。但是，我们不知道以前悬停在哪个单选按钮上，实际上，除非您需要，否则跟踪它是没有意义的。

对于您在本文中使用的标记（jquery），我想您正在使用该库，使用jquery非常简单，我想您可以通过以下方式实现：

$('#radio1').mouseover(function(){
    $(this).removeClass('classname1 classname2');
    $(this).addClass('classname');
});

---

你用jquery标记了这个。您正在使用jquery吗？或者你会用javascript来实现这一点吗？我认为如果你使用jQuery，你应该避免使用“document.getElementById”。

$('#radio1').mouseover(function(){
    $(this).removeClass('classname1 classname2');
    $(this).addClass('classname');
});