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. 深入理解HTTP协议、HTTP协议原理分析

    http://blog.csdn.net/g1036583997/article/details/50457441

  2. iOS开发 Masonry的简单使用

    首先,在正式使用Masonry之前,我们先来看看在xib中我们是如何使用AutoLayout     从图中我们可以看出,只要设置相应得局限,控制好父视图与子视图之间的关系就应该很ok的拖出你需要的需 ...

  3. Evolutionary Computing: 4. Review

    Resource:<Introduction to Evolutionary Computing> 1. What is an evolutionary algorithm? There ...

  4. 0010 Linux 目录操作命令

    01.更改目录 cd  /  返回根目录 cd ~  返回用户根目录 cd -  返回上个操作目录目录 ,等同于cd $OLDPWD 02.查看工作目录 pwd 03.创建目录 mkdir 目录名 0 ...

  5. 【修改端口号】linux下修改apache，nginx服务端口号

    一.linux下修改apache端口号 yum安装后,apache配置文件: /etc/httpd/conf/httpd.conf 找到apache目录下的 httpd.conf, 使用vi 打开,找 ...

  6. Clojure学习笔记(二)——函数式编程

    定义 “函数式编程”是一种编程范式(programming paradigm),即如何编写程序的方法论.主要思想是把运算过程尽量写成一系列嵌套的函数调用. 举例来说,现在有这样一个数学表达式: (1 ...

  7. gz

    不准备的话,是真的会滚粗的. leetcode  还是重新做起来叭. 那么就开始咯 8.22 leetcode 144 Binary Tree Preorder Traversal 二叉树的前序遍历 ...

  8. UITableView编辑

      UITableView 编辑步骤如下: 1.让TableView处于编辑状态 2.协议设定  2.1.确定Cell是否处于编辑状态  2.2.设定Cell的编辑样式(删除.添加)  2.3.编辑状 ...

  9. Activity启动清空原任务栈

    就是 启动新的activity  但是把之前所有的activity 都finish掉 而且所有的activity 都是在一个栈中 Intent intent = new Intent();intent ...

  10. ESXi虚拟磁盘共享

    因为项目需要需要一个磁盘共享的环境. 最先想到用iSCSI,两个客户端挂载同一个远端盘:这样确实可行,但是感觉太繁琐,想到既然是虚拟机环境,可以设置虚拟磁盘共享. 于是网上一番搜罗,确实有人这个做过, ...