仅使用javascript和CSS进行元素更改

试图让我的网页更具动态性，方法是在单击复选框时更改某些元素的背景。我试图通过改变类和CSS表来实现这一点。我的onclick函数ins没有定义（在IE9中），下面是一个错误。更重要的是，如果我只更改对象的类，则网页会更新，因为该对象在CSS文件中具有不同的类。如果这不起作用，还有什么更好的选择

我的elemenet和函数

更新 我按照许多人的建议对HTML和CSS文件进行了更新。我的网页仍然没有变化，但控制台声称我从onclick事件调用的函数没有定义，这有点奇怪，因为它是。这种类型的脚本是否也属于HTML，或者我是否应该将其取出并放入一个单独的文件中。我想，因为它是在创建元素，所以它属于主html。有没有更简洁的方法来实现这一点，而不是让我的主屏幕html变得巨大

<tr class= 'tr.notchosen'><td><input type='checkbox' onclick='handleClick(this.id)'/></td></tr> 

function handleClick(cb) {

     var currentColumn = cb.parentNode
     var currentRow = currentColumn.parentNode
     if (currentRow.className === "chosen")
     {
     currentRow.className = "notchosen";
     }
     else
     {
     currentRow.className = "chosen";
     }
    }

---

这里发生了几件事。首先，您的css选择器不太正确。事实上，我建议将类名设为“selected”或“notselected”，然后用该类选择tr元素

<tr class='notchosen'>

此外，尽管我不建议使用内联javascript，但以您的示例为例，如果您想使用元素，应该传递

this

，而不是传递字符串的

this.id

onclick='handleClick(this)'

最后一部分是将javascript与类名更改同步

if (currentRow.className == "chosen")
{
 currentRow.className = "notchosen";
}
else
{
 currentRow.className = "chosen";
}

---

类名不是选择器。css用于tr标记和choosen类，而js用于“tr.choosen”类。@SLaks:huh。myclass应该选择所有myclass元素，不是吗？@dandavis：是的，但他没有使用那个类名。句点是CSS类名中的非法字符。将

更改为

。您还需要更新

if（）

语句和

currentRow.className

。并且在与“已选择”进行比较时更喜欢使用===非常感谢我按照建议进行了更新，尽管我收到了SCRIPT5009：“handleClick”在IE9的控制台窗口中未定义。还有一种更好的方法来获取parentnode的父节点，而我现在所做的就是声明一个变量来获取该变量的父节点。

onclick='handleClick(this)'

if (currentRow.className == "chosen")
{
 currentRow.className = "notchosen";
}
else
{
 currentRow.className = "chosen";
}