我想改变td标签的类给定td标签的id:
<td id="td_id" class="change_me"> ...
我希望能够做到这一点,而在一些其他dom对象的点击事件。我如何获取td的id并改变它的类?
我想改变td标签的类给定td标签的id:
<td id="td_id" class="change_me"> ...
我希望能够做到这一点,而在一些其他dom对象的点击事件。我如何获取td的id并改变它的类?
当前回答
这个方法对我很有效
$('#td_id').attr('class','new class');
其他回答
所以你想在点击的时候改变它…让我把整个过程讲一遍。 让我们假设你的“外部DOM对象”是一个输入,就像一个选择:
让我们从这个HTML开始:
<body>
<div>
<select id="test">
<option>Bob</option>
<option>Sam</option>
<option>Sue</option>
<option>Jen</option>
</select>
</div>
<table id="theTable">
<tr><td id="cellToChange">Bob</td><td>Sam</td></tr>
<tr><td>Sue</td><td>Jen</td></tr>
</table>
</body>
一些非常基本的CSS:
#theTable td {
border:1px solid #555;
}
.activeCell {
background-color:#F00;
}
并设置一个jQuery事件:
function highlightCell(useVal){
$("#theTable td").removeClass("activeCell")
.filter(":contains('"+useVal+"')").addClass("activeCell");
}
$(document).ready(function(){
$("#test").change(function(e){highlightCell($(this).val())});
});
现在,无论何时从选择中选择内容,它都会自动找到具有匹配文本的单元格,允许您颠覆整个基于id的过程。当然,如果您想这样做,您可以轻松地修改脚本,使用id而不是值
.filter("#"+useVal)
并确保适当地添加id。希望这能有所帮助!
我最好使用.prop来改变className,它工作得很好:
$(#td_id).prop('className','newClass');
对于这一行代码,你只需要改变newClass的名称,当然还有元素的id,在下一个例子中:idelementinyourpage
$(#idelementinyourpage).prop('className','newClass');
顺便说一下,当您想要搜索应用于任何元素的样式时,您只需在页面显示时单击浏览器上的F12,然后在DOM Explorer的选项卡中选择您想要查看的元素。在Styles中,你可以看到你的元素应用了什么样式,以及它是从哪个类读取的。
如果你已经有了一个类,并且需要在类之间交替,而不是添加一个类,你可以链式切换事件:
$('li.multi').click(function(e) {
$(this).toggleClass('opened').toggleClass('multi-opened');
});
你可以这样做: $ (" # td_id ") .removeClass(“Old_class”); $ (" # td_id ") .addClass(“New_class”); 或者你可以这样做
$("#td_id").removeClass('Old_class').addClass('New_class');
使用jQuery 你可以使用.attr()来设置类(不管它是什么),像这样:
$("#td_id").attr('class', 'newClass');
如果你想添加一个类,可以使用.addclass(),如下所示:
$("#td_id").addClass('newClass');
或者使用.toggleClass()交换类的简单方法:
$("#td_id").toggleClass('change_me newClass');
下面是专门用于class属性的jQuery方法的完整列表。