jquery选择器之子元素

  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")

  

 

上一篇:js 平滑定位


下一篇:Android为TV端助力 关于线程的那些事