CSS中：nth-child和JQuery：eq的区别

:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。例如选第2个就直接:nth-child(2)

:eq() 选择器选取带有指定 index 值的元素。

index 值从 0 开始，所有第一个元素的 index 值是 0（不是 1）。例如选第2个是:eq(1)，而不是2

方法很多，建议将jquery的语法研读一下。

这里可以用：

$(this)next() 当前元素的下一个子元素

$(this)siblings() 选择所有同级子元素除了自身

推荐方法修改类似这样：

$('li')on('click', 'a', function(){

$(this)siblings()css('display', 'none');

})

这样再添加更多的 a 也无所谓了。

首先看一段HTML代码，如下：

1 <table id="tb">

2 <tr>

3 <td>0</td>

4 <td>1</td>

5 <td>2</td>

6 </tr>

7 <tr>

8 <td>3</td>

9 <td>4</td>

10 <td>5</td>

11 </tr>

12 </table>

如果要获取第二个tr里的第二个td的值：

Children：

$("#tb>tbody")children("tr:eq(1) td:eq(1)")html()

Find ：

$("#tb>tbody")find("tr:eq(1) td:eq(1)")html()

结果，通过children获取的值为：null,而通过find获取的值为：4 这是为什么呢？

查了一下资料，通过children获取的是该元素的下级元素，而通过find获取的是该元素的下级所有元素。

这时回到上面，可以得出，$("#tb>tbody")children() 获取的是两个tr元素（不包括它们子元素td），

而children里面的选择器则是在获取的两个tr元素里再根据条件进行筛选，所以上面那种写法获取不到值。

如果一定用children可以这样写：

$("#tb>tbody")children("tr:last")children("td:eq(1)")html()

需要准备的材料分别有：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：indexhtml，并引入jquery。

2、在indexhtml中的<script>标签，输入jquery代码：

$('body')append($('top1div span')attr('id'));

3、浏览器运行indexhtml页面，此时成功获取到了top1div类中span标签的id并打印了出来。

以上就是关于CSS中：nth-child和JQuery：eq的区别全部的内容，包括:CSS中：nth-child和JQuery：eq的区别、jquery this 选择子元素怎么做、一个例子看清楚JQuery子元素选择器children和find的区别等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！