過濾選擇器first與子元素過濾選擇器first-child的區別

一、表格代碼以下：

<table id="table">
            <tr>
                <td>id</td>
                <td>name</td>
            </tr>
            <tr>
                <td>1</td>
                <td>aaa</td>
            </tr>
            <tr>
                <td>2</td>
                <td>bbb</td>
            </tr>
            <tr>
                <td>3</td>
                <td>ccc</td>
            </tr>
        </table>

二、表格顯示以下：

id	name
1	aaa
2	bbb
3	ccc

三、分析first和first-child

過濾選擇器first

首先找到id爲t2的元素，再查找下面的子元素tr,從第一個tr元素開始查找子元素:第一個td,找到之後中止

$("#t2 tr td:first").css("background","red");

子元素過濾選擇器first-child

首先找到id爲t2的元素，再查找下面的子元素tr，而後查找每個tr下邊的第一個td元素。

$("#t2 tr td:first-child").css("background","red");