jquery 取 子元素-css选择非第一个元素的子元素的三种方式

第一种：使用伪类选择器：不

    
    
    
    
    
		#od div{float:left;height:100px;width:100px;margin:0 10px;background:#ccc;}
		#od div:not(:first-child){background:red;}
    


    

		
1
		
2
		
3
    

第二种：使用 nth-of-type 或 nth-child

顾名思义，n是从0开始的，所以n+1自然是从1开始的，这样n+3就从第三个元素开始。 同样jquery 取 子元素，如果是选择偶数元素，那么就是2n+1，如果是要选择奇数元素，那么就应该写成2n+2； 具体情况可根据项目情况使用。

nth-of-type 和 nth-child 的区别这里写得很清楚了，这里就不介绍了。

    
    
    
    
    
		#od div{float:left;height:100px;width:100px;margin:0 10px;background:#ccc;}
		
		/*#od div:nth-child(n+1){background:red;}*/
		#od div:nth-of-type(n+1){background:red;}
		
    


    

		
1
		
2
		
3
    

第三种方式：巧妙利用+兄弟选择器

    
    
    
    
    
		#od div{float:left;height:100px;width:100px;margin:0 10px;background:#ccc;}
		
		#od div+div{background:red;}
    


    

		
1
		
2
		
3
    

至于为什么+选择器为什么可以呢？ 很简单的#oddiv+div选择器jquery 取 子元素，意思是选择#od元素下面的所有后代div元素的兄弟元素，所以第二个元素之后的div元素都这样被选中了，为什么第一个没有被选中呢绒？ 很简单，第一个div元素之前没有兄弟元素，所以无法选中，这样就得到了想要的结果。