jquery选择器之伪类选择器

时间：2022-12-18 16:37:59

伪类选择器：

:nth-child的用法：

nth-child是一个css3伪类选择符,在jQuery中被实现了，在Jquery API中对nth-child的定义是：”匹配其父元素下的第N个子或奇偶元素“。

例  伪类nth-child实现隔行换色

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>jQuery实现隔行变色</title> 
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<style type="text/css"> 

</style> 
<script type="text/javascript"> 
$(function(){ 
    $("#tbEmp tr:nth-child(even)").addClass("trOdd"); 
    $('#tbEmp tr:nth-child(odd)').css("color","red");
    $('#tbEmp tr:nth-child(even)').css("color","blue");
}); 
</script> 

</head> 

<body> 
<table id="tbEmp" cellpadding="0" cellspacing="0"> 
    <tbody > 
        <tr><td>1</td></tr> 
        <tr><td>2</td></tr> 
        <tr><td>3</td></tr> 
        <tr><td>4</td></tr> 
        <tr><td>5</td></tr> 
        <tr><td>6</td></tr> 
    </tbody> 
</table> 
</body> 
</html>



标签：

相关文章