jQuery addClass无法正常工作

我正在尝试使用addClass在我的Joomla模板上给我斑马条纹表.我使用以下代码:

我已经能够使用tr:odd选择器动态地将css添加到表行,但是当我使用addClass函数时它只是不行(我检查了生成的源代码,并且没有表行具有"奇数"类) .

不知道我可能做错了什么,会感激任何帮助.

1> Josh Stodola..：

---

所以你知道,当你查看源代码时,不会反映使用Javascript对DOM的更改.

如果您的CSS看起来像这样,该代码应该有效...

tr.odd td
{
    background:#070;
}

---

谁心智正常会对这个答案进行投票？

---

在firefox上安装Firebug.有了它,您可以监视DOM并查看对源代码所做的动态更改.

2> egyamado..：

---

这里有两种创建斑马条纹的方法/方法,一种是使用jQuery,另一种是使用CSS3.

第一种方法 - 使用jQuery

HTML

要创建"条带化"表,我们需要创建一个带有id的表来标识它,并将样式仅应用于该表,在本例中我们将其命名为" zebra_triped "

    

        
Lorem ipsum dolor sit amet
        
Lorem ipsum dolor sit amet
    
    

        
Lorem ipsum dolor sit amet
        
Lorem ipsum dolor sit amet
    
    

        
Lorem ipsum dolor sit amet
        
Lorem ipsum dolor sit amet
    
    

        
Lorem ipsum dolor sit amet
        
Lorem ipsum dolor sit amet
    
    

        
Lorem ipsum dolor sit amet
        
Lorem ipsum dolor sit amet
    

CSS

我们为偶数行创建一个样式,为奇数行创建另一个样式.

jQuery的

最后,我们需要创建将CSS类添加到tr标签的jQuery代码,这可以通过以下代码实现:

第一行选择id为zebra_triped的元素中的奇数tr标签,并将它们添加为"oddRow"类,最后一行与偶数行相同,将它们添加为"evenRow"类.

第二种方法 - 使用CSS

**我的最爱 :)*

HTML

    
Comments
    

        
By:  Lorem ipsum 
        
Lorem ipsum dolor sit amet, consectetur adipisicing elit,.
    
    

        
By:  Lorem ipsum 
        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
    
    

        
By:  Lorem ipsum 
        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
    
    

        
By:  Lorem ipsum 
        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
    
    

        
By:  Lorem ipsum 
        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
    

CSS

- MOZ -border半径:11像素; 和- webkit -border-radius:11px; 在这里,我为每个角定义容器边框的半径/圆角.这只是一行指定所有角的半径属性,但我可以指定特定角,如下所示:

- moz -border-radius-bottomleft:11px;
- moz -border-radius-bottomright:11px;
- moz -border-radius-topleft:11px;
- moz -border-radius-topright:11px;

和

- webkit -border-radius-bottomleft:11px;
- webkit -border-radius-bottomright:11px;
- webkit -border-radius-topleft:11px;
- webkit -border-radius-topright:11px;

希望这可以帮助,

艾哈迈德