<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <style type="text/css"> *{margin:0;padding:0;} ul li{ list-style:none;} img {border:0 none;} body {padding:100px;} input[type='button']{width:100px; height:38px;display:block;position:fixed;right:20%; top:50px;} span{display:inline-block;float:left;width:100px; height:100px; text-align:center;border:1px blue solid;margin-right:10px;} </style> <script type="text/javascript"> $(function(){ $("input[type='button']").focus().click(function(){ // 使用children() // $(".demo").children('*').css({ // color:'red', // border:"2px red solid", // }) // .end().after('<p>所有子节点:<br/>'+$(".demo").children('*').length+'</p>') //使用find() $('.demo').find('*').css({ color:'red', border:"2px red solid", }) .end().after('<p>所有子节点:<br/>'+$('.demo').find('*').length+'</p>') }) }) </script> <input type="button" value="点击测试"/> <div class="demo"><span>span子节点<b>b孙节点</b></span></div>