<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src="/jquery/jquery.js"></script>

</head>

<body>

<ul class="level-1">

  <li class="item-i">I</li>

  <li class="item-ii">II

    <ul class="level-2">

      <li class="item-a">A</li>

      <li class="item-b">B

        <ul class="level-3">

          <li class="item-1">1</li>

          <li class="item-2">2</li>

          <li class="item-3">3</li>

        </ul>

      </li>

      <li class="item-c">C</li>

    </ul>

  </li>

  <li class="item-iii">III</li>

</ul>

<script>$('ul.level-2').children().eq(2).css('background-color', 'red');</script>

</body>

</html>

解释：children() 是儿子节点，与孙子节点是无关的。

结果如图：

children() 和find() 的区别。

如果是find()，eq(2)会把 整个的 第二个li 给算上。find() 会把孙子节点也算上。

<!DOCTYPE html>

<html>

<head>

  <script type="text/javascript" src="/jquery/jquery.js"></script>

</head>

<body>

<ul class="level-1">

  <li class="item-i">I</li>

  <li class="item-ii">II

    <ul class="level-2">

      <li class="item-a">A</li>

      <li class="item-b">B

        <ul class="level-3">

          <li class="item-1">1</li>

          <li class="item-2">2</li>

          <li class="item-3">3</li>

        </ul>

      </li>

      <li class="item-c">C</li>

    </ul>

  </li>

  <li class="item-iii">III</li>

</ul>

<script>

$('li.item-ii').find('li').eq(2).css('background-color', 'red');

</script>

</body>

</html>

结果如下：

jQuery 中的children()和 find() 的区别的更多相关文章

  1. jquery中的children()和contents()的区别

    1.children()只会返回元素节点 2.contents()还可以返回文本节点

  2. jquery遍历之children()与find()的区别

    hildren(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选,添加参数表示通过选择器进行过滤,对元素进行筛选. .find(selector)方法是返回匹配元 ...

  3. jQuery中的bind() live() delegate()之间区别分析

    jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...

  4. 深入理解jQuery中live与bind方法的区别

    本篇文章主要是对jQuery中live与bind方法的区别进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助 注意如果是通过jq添加的层和对象一定要用live(),用其他的都不起作用 ...

  5. jQuery中attr和prop方法的区别说明

    jquery中attr和prop的基本区别可以理解为:如果是内置属性,建议用prop,如果是自定义的建议用attr. 例如 <input type=check  node=123 id=ck & ...

  6. jquery中的$().each和$.each的区别

    jquery中的$().each和$.each的区别 注意:jquery中的$().each和$.each的区别,前者只能遍历数组,后者可以遍历数组和对象 备注:sinobook项目中地名本体相关地按 ...

  7. jQuery中attr和prop方法的区别

    jQuery中attr和prop方法的区别。 http://my.oschina.net/bosscheng/blog/125833 http://www.javascript100.com/?p=8 ...

  8. jquery中的this与$(this)的区别总结（this：html元素）（$(this)：JQuery对象）

    jquery中的this与$(this)的区别总结(this:html元素)($(this):JQuery对象) 一.总结 1.this所指的是html 元素,有html的属性,可用 this.属性  ...

  9. jquery中this与$(this)的用法区别

    jquery中this与$(this)的用法区别.先看以下代码: $("#textbox").hover( function() { this.title = "Test ...

随机推荐

  1. Linux中文显示乱码解决

    输入 echo $LANG可以查看当前使用的系统语言 查看是否有中文语言包可以在终端输入 locale命令,如有zh cn 表示已经安装了中文语言 没有则 yum groupinstall chine ...

  2. JavaEE基础（十九）/异常和File

    1.异常(异常的概述和分类) A:异常的概述 异常就是Java程序在运行过程中出现的错误. B:异常的分类 通过API查看Throwable Error 服务器宕机,数据库崩溃等 Exception ...

  3. jquery easyui读取json文件乱码

    输出的json要求用utf-8,否则因json的编码格式有问题显示不了中文.记事本默认编码是ANSI,若保存的json是由记事本改后的缀名,则json格式有问题,显示中文为乱码. 解决方法:打开.js ...

  4. java 面试每日一题

    题目:一球从100米高度自由落下,每次落地后反跳回原高度的一半:再落下,求它在 第10次落地时,共经过多少米?第10次反弹多高? import java.util.Scanner; public cl ...

  5. rtc关机闹钟7 jni层 com_android_server_AlarmManagerService

    frameworks/base/services/core/jni/com_android_server_AlarmManagerService.cpp int AlarmImplAlarmDrive ...

  6. 【转】MYSQL入门学习之一：基本操作

    转载地址:http://www.2cto.com/database/201212/173868.html 1.登录数据库    www.2cto.com       命令:mysql -u usern ...

  7. 浪首登录浮层增加收藏入口项目学到的几点知识-IE7 bug、relatedTarget、字符串换行

    这两天做这个项目略有收获,记录如下: 1. 项目中有个bug,在IE7中登录成功时下拉菜单没有展开的情况下总有个残影在页面中,如下图所示: 通过多种方法都没有解决,后来才知道原来是在IE中displa ...

  8. sp_sys_ERPTrigger_base

    USE [GalaxyPointDB24]GO/****** Object:  StoredProcedure [dbo].[sp_zy_Process_scrap]    Script Date: ...

  9. mysql一些常用命令总结

    mysql时间戳转日期格式SELECT FROM_UNIXTIME(add_time,'%Y-%m-%d %H:%i:%s') FROM `wh5_username` where id=23; 按in ...

  10. poj 2420，模拟退火算法，费马点

    题目链接:http://poj.org/problem?id=2420 题意:给n个点,找出一个点,使这个点到其他所有点的距离之和最小,也就是求费马点. 参考链接:http://www.cnblogs ...