JQuery中addClass方法使用无效是怎么回事

Greentea107 2010-04-03 09:22:12

在HMTL中我是从外部链入一个CSS文件，文件里有一个.tabLabel的类，然后在HTML里有一个表格，表格的样式是.checkOut类，然后我希望表格中的所有的td的样式都使用tabLabel。代码如下
$(document).ready(function(){
$('checkOut td').addClass('tabLabel');
});
然后运行后竟没有反应，就是说td根本没有把tabLabel做为样式，我目前只能用JQuery的css方法来为td添加样式，不明白是css方法能正常运行，为什么addClass方法就不行了？

...全文

21484 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

nanyang9 2010-04-03

打赏
举报

给分很有意思, 如果不是想混几个下载文件的分, 我是不会来这里的.
以后对于乱给分人还是谨慎考虑是否回答为好.免得在这里受气

chenbin520 2010-04-03

打赏
举报

.tabLable {
width:200px;
background:#FFFFFF;
}
你的样式类名写错了
tabLabel

nanyang9 2010-04-03

打赏
举报

首先4楼说的有道理
我是不了解JQ,究竟$('checkOut td')得到的列表是否该循环, 1楼说的值得考虑.
最后, 我前面分析的是正确的, .addClass() 只是多添加一个,并不是覆盖.
建议先使用 .removeClass(); 移除原有样式后再添加新样式

Greentea107 2010-04-03

打赏
举报

奇怪了，是不是JQuery不支持外部链接的CSS文件，我在HTML文件里直接写入.tabLabel类后却能正常运行了？难道是JQuery的BUG

Greentea107 2010-04-03

打赏
举报

我现在把HTML贴出来

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<link href="css/checkOut.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="js/jquery.js" ></script>

<script type="text/javascript">

$(document).ready(function(){

	

	//$('.checkOut td').css({background:"#ffc"});

	$('.checkOut td').addClass("tabLabel");

});

</script>

<title>无标题文档</title>



</head>



<body><table width="200" border="1" class="checkOut">

  <tr>

    <td> </td>

    <td> </td>

    <td> </td>

  </tr>

  <tr>

    <td> </td>

    <td> </td>

    <td> </td>

  </tr>

  <tr>

    <td> </td>

    <td> </td>

    <td> </td>

  </tr>

</table>



</body>

</html>

@CHARSET "UTF-8";
.checkOut {
margin:0 auto;
width:700px;
font-size:12px;
text-align:center;
line-height:20px;
border:1px solid #ccc;
background-color: #CCCCCC;
}
.tabLable {
width:200px;
background:#FFFFFF;
}

tonyzzp 2010-04-03

打赏
举报

本来会不会就有class属性了
再addclass就不会生效
所以这样 attr("class","myclass")

铑枪--突廆孒 2010-04-03

打赏
举报

<td class="checkOut tabLabel">
addClass 为增加样式，即
若原来样式为class="a b c"，
调用addClass("d")后，样式变为了
class="a b c d"
d增加在最后。而按样式的解析原则：a,b,c,d样式取并集(共存)，若有冲突，取最后的。
如：
.a{
font-size:15px;
color:red;
}
.b{
color:blue;
}

那最后的样式就是
{
font-size:15px;
color:blue;
}
而a的红色字体样式被b的蓝色字体样式覆盖了。。。

chenbin520 2010-04-03

打赏
举报

通过样式来选择元素应该是这样的吧
$(document).ready(function(){
$('.checkOut td').addClass('tabLabel');
});
还有就是可以去firefox中查一下，样式有没有添加进去

Greentea107 2010-04-03

打赏
举报

目前的JQuery是不存在.setClass方法的，而且我看JQuery的手册上的意思是$('checkOut td')可以对这个类下的所有td添加样式的，而且就算td本来有样式，但用了addClass后就会覆盖原有样式的，但问题是现在根本添不上样式啊

nanyang9 2010-04-03

打赏
举报

使用JQ如何改变样式我不太清楚,但HTML使用样式的底层原理还是知道的.
比如 <td class="checkOut"> 使用了一个样式类
但 <td class="checkOut tabLabel"> 却使用了两个样, 至于哪一个的优先级别高,那就不太清楚了.

.addClass() 顾名思义,是添加样式,而不是改变原有的样式
我想,JQ中是不是存在一个这样的方法呢 .setClass()
建议翻手册找找