【体会】用jquery做Css做不到的事情

今天做了两个事情,感觉到js太强大了。

以前只会div+CSS,那时候感觉自己很牛逼,

现在碰到了一些难题和大家分享下

我在做phpbb论坛模板的时候,很经典的用到了js,确切的说是jquery

因为论坛版块之间的往往是循环自动生成的,所以很难在单个版块之间用特定的css

比如图:

 

我要在这个论坛最后一个地方加上一个版块。然后和上面的版块隔开,并给个特定颜色让他更突出

在我没学jquery之前。我肯能回去研究php然后在特定位置写入class类

然后再写css

可这个地方它是用表格循环,很多css根本没用,就像这个间隔。看我是如何做的。

我就是在最后一个版块上面加了一个tr让他有一定的高度。就可以了

至于最后一个加颜色。只要用js选中这个a标签加上css就搞定了!!

 

来看我的js代码

 

 
[code lang=”js”]
<script>
var paf=jQuery.noConflict();
paf(document).ready(function(){
paf(".wudi2_2").find("tr").last().before("<tr><td colspan=’5′ height=’20’></td></tr>");//增加一个tr合并5行,让高20实现空格
paf(".wudi2_2").find("tr").last().find("a").first().addClass("supa");//在最后一个tr里面找到第一个a标签,给他一个supa的class
});
</script>
[/code]
CSS:
[code]
.supa{ color:#ff6600 !important }
[/code]
生成后的html:
[code]
<tr>
<td height="20" colspan="5"></td>
</tr>
<tr>
<td class="row1 shu2" align="center" width="50">
<td class="row1 shu1" width="100%">
<a class="forumlink supa" href="http://forum.cityofsteam.com/sneak-peek-alpha-test-f12.html">Sneak Peek Alpha Test</a>
<p class="forumdesc">Here is everything related to sneak peek alpha test, including news, questions, discussions ect.</p>
</td>
<td class="row2 shu2" align="center">
<td class="row2 shu1" align="center">
<td class="row2 shu2" nowrap="nowrap" align="center">
</tr>

[/code]