使用javascript将css类添加到td标记

Question

我正试图以Greasemonkey脚本的形式制作Moodle的时间表。

这个想法是突出当前时间的主题，但我找不到一种有效的方法。

我正在向页面中注入css，并使用jQuery将注入的css类添加到目标td。

这是注入页眉的css代码：

.current_class {background-color:green};

这是用于将类添加到td的JavaScript代码：

var cell = $("#timetable_table").find("tr").eq(current+1).find("td").eq(date.getDay());

我知道cell是正确的td，因为我可以使用cell.text（“foo”）并修改正确的单元格，但是当我这样做时：

cell.addClass("current_class");

表保持不变。

我不必这样做，我只想动态更改td标签上的背景，所以我不介意使用其他方法。

感谢。

Answer 1

首先，我建议你改为：

var cell = document.getElementById('timetable_table').rows(current+1).cells(date.getDay());

和

cell.className += (cell.className ? " " : "")+"current_class";

但这仅适用于performance reasons

问题的可能原因是您在其他地方background-color具有更高的特异性。尝试使用此CSS选择器：

#timetable_table tr>td.current_class{background-color:green};

这应该具体到足以赢得胜利。

Answer 2

使用className属性进行更改或添加类，例如：

tbody.firstChild.lastChild.className='tr-parent1';