HTML代码：

　　:first-child 匹配第一个子元素，每个父元素的第一个子元素

　　:last-child 匹配最后一个子元素，每个父元素的最后一个子元素

　

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <!--HTML区域-->

    <h1>第一个标题</h1>

    <div class="nav-2014">

        <div class="w">

            <div class="w-spacer"></div>

            <div class="categorys">

                <div class="dt">家用电器分类</div>

                <div class="dp">家用电器价格</div>

            </div>

            <span class="hr"></span>

            <div class="navitems-2014">

                <div id="treasure"></div>

                <span class="clr"></span>

                <span class="chr"></span>

                男：<input type="checkbox" checked="checked" value="nan">

                女:<input type="checkbox" value="nv">

            </div>

        </div>

    </div>

    <h2>第二个标题</h2>

    <div id="electronic">

        <div id="firstScreen">1

            <div class="w">2</div>

        </div>

        <ul>

            <li class="ui-switch-curr">第一</li>

            <li class="ui-switch-item"></li>

            <li class="ui-switch-next">第三</li>

            <li class="ui-switch-sub">第四</li>

        </ul>

        <ul>

            <li class="lizi">梨</li>

            <li class="pingguo">苹果</li>

        </ul>

        <div class="secord_screen">

            <div></div>

        </div>

        <div class="third_screen"></div>

    </div>

</body>

</html>

　　jquery区

    <script src="jquery-3.1.0.js"></script>

    <script>

//        获取每个ul下的第一个li元素

        $("ul li:first-child")

//        获取每个ul下的最后一个li元素

        $("ul li:last-child")

　　

　

jquery选择器之子元素的更多相关文章

  1. jQuery选择器之子元素过滤选择器Demo

    测试代码: 07-子元素过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" & ...

  2. jQuery选择器之子元素选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  3. 深入学习jQuery选择器系列第二篇——过滤选择器之子元素选择器

    × 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 在上一篇中已经介绍过基础选择器和层级选择器,本文开始介绍过滤选择器.过滤选择器是jQuery选择器中最为庞大也是最为 ...

  4. css 选择器之子元素

    /*html*/ <div class="wrap"> <span>1</span> <span>2</span> &l ...

  5. css3类选择器之结合元素选择器和多类选择器

    css3类选择器之结合元素选择器和多类选择器用法: <!DOCTYPE html> <html lang="en"> <head> <me ...

  6. jquery如何阻止子元素相应mouseout事件

    jquery如何阻止子元素相应mouseout事件:mouseout有一个特点,当鼠标移入子元素的时候,也会触发此事件,但是在实际应用中这个特点往往不是我们想要的,下面就通过代码实例介绍一下如何实现此 ...

  7. jquery选择器之获取父级元素、同级元素、子元素

    一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 二.获取同级元素: 1.next([expr]): 获取指定元素的下一个同级元素 2.nextAll([expr]) ...

  8. jQuery选择器之表单元素选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  9. jQuery选择器之元素选择器

    元素选择器:根据给定(html)标记名称选择所有的元素. 描述: $('element') 搜索指定元素标签名的所有节点,这是一个合集的操作.同样的也有原生方法getElementsByTagName ...

随机推荐

  1. eclipse中新建jni工程

    1.什么是NDK 网上很多不多说,全称是Android Native Developer Kit,是一个工具合集,我理解可以把c/c++打包成.so文件 这是目录结构,要用到指令ndk-build 需 ...

  2. 用substr()截取中文出现乱码的解决方法

    截取中文字符串时出现乱码(使用substr()函数) 程序一:PHP截取中文字符串方法 function msubstr($str, $start, $len) {    $tmpstr = &quo ...

  3. 主页面获取iframe 的子页面方法。

    父页面parent.html <html> <head> <script type="text/javascript"> function sa ...

  4. mybatis批量更新 UPDATE mysql

    oracle和mysql数据库的批量update在mybatis中配置不太一样: oracle数据库: <update id="batchUpdate" parameterT ...

  5. Python抓取网页中的图片到本地

    今天在网上找了个从网页中通过图片URL,抓取图片并保存到本地的例子: #!/usr/bin/env python # -*- coding:utf- -*- # Author: xixihuang # ...

  6. python中lambda表达式应用

    对于简单的函数,也存在一种简便的表示方式,即:lambda表达式 #普通函数1 def func(a): return a+1 print 'test1_func0:',func(1000)4#lam ...

  7. PHP 扩展开发小结

    1. 变量操作(常量) 设置变量 ZVAL_*系列函数; 例: zval t; ZVAL_STRING(t,"10",2); 获取变量 Z_* 系列函数 获取变量指针 Z_*_P ...

  8. ROS实际问题解决方法

    1.建立软链接 在路径cd /etc/udev/rules.d中,建立例如50-rfid.rules的文件,它会根据文件名之前的50 51等判断优先级,50的优先级就大于51 如:  KERNEL== ...

  9. alter table的用法

    在数据库开发过程中,除了用得最多的数据库查询外,我们有时也需要去修改数据表的定义,比如在已存在的数据表中新增列和删除列等.这篇文章就总结一下alter table语句的用法. 示例代码如下. USE ...

  10. HTTP 超时

    TWinHTTPTimeouts = class(TPersistent) private FConnectTimeout, FReceiveTimeout, FSendTimeout: DWord; ...