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. Myeclipse 找不到Convert to maven project选项

    https://my.oschina.net/u/2419190/blog/504417 Window > Preferences > General > Capabilities  ...

  2. css透明度的兼容!!!

    以前总是写透明度的代码,今天弄了个弹出框要求就边框透明,于是有了下边的结论,虽然很多东西不合理了,日后找到更合理在做更新!!! html <div class="new_playerf ...

  3. linux应用开发小结

    这几天一直在看<在实践中学嵌入式linux应用程序开发>这本书,昨天下午的时候算是把这本书完全搞懂了.除了第一章的交叉编译环境的搭建和第七章linux设备驱动开发第八章的安卓应用开发和第九 ...

  4. [vijos P1035] 贪婪的送礼者

    为何我要做此等弱智题,只因我太久不码代码,心有所虚… 明天的任务是,做些难题,累了就理房间,实在不行就睡觉,不要做别的事情w 目测自己做不到呢OAO program vijos_p1035; ..] ...

  5. 在Eclipse上建立hadoop2.2.0/hadoop2.4.0源代码阅读环境

    1.安装依赖的包: yum install gcc-c++ g++ autoconf automake libtool cmake zlib1g-dev pkg-config libssl-dev 2 ...

  6. Nginx反向代理关于端口的问题

      Nginx反向代理关于端口的问题   http://www.cnblogs.com/likehua/p/4056625.html Nginx默认反向后的端口为80,因此存在被代理后的端口为80的问 ...

  7. Spark随笔(二):深入学习

    一.如何选择粗粒度和细粒度 从底层往上引申来理解粗粒度与细粒度. 一层:一个类,具有三个属性值.为了查询这个类的所有实例,细粒度查询的程度为属性值,即依次查询每个实例化对象的属性值,查询三次:粗粒度按 ...

  8. Android启动模式(三种)

    1,标准启动模式 通过任务栈,每点一次button,将每一个实例都压入,然后点返回键时候,就弹出之前压入的实例. 每一次的地址都是不同的 测试代码:通过创建一个button和textView来显示本身 ...

  9. sphinx 增量索引 实现近实时更新

    一.sphinx增量索引的设置   数据库中的已有数据很大,又不断有新数据加入到数据库中,也希望能够检索到.全部重新建立索引很消耗资源,因为我们需要更新的数据相比较而言很少.例如.原来的数据有几百万条 ...

  10. augustus, gene prediction, trainning

    做基因组注释 先用augustus训练,然后再用maker做基因注释 augustus提供一些训练好的,如果有和你的物种非常接近的,直接用提供的,没有的话再自己训练. 网址: http://bioin ...