1.
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 7 <title>获取DOM节点个数和节点内容</title> 8 <link rel="stylesheet" href="common.css" type="text/css" /> 9 <script src="jquery-1.5.2.js" type="text/javascript"></script> 10 <script type="text/javascript"> 11 $(document).ready( function() { 12 //children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈)。 13 //参数可选,添加参数表示通过选择器进行过滤,对元素进行筛选。 14 var $nodes = $("#root").children(); 15 alert("number of nodes is " + $nodes.length); 16 var txt = ""; 17 //获取所有子元素并且遍历 18 $("#root").children().each(function() { 19 txt += $(this).text()+"<br />"; 20 }); 21 alert($("#root").children().text()); 22 alert($("#root").html()); 23 $('#root').text("Hello World!"); 24 $('#root').html("<b>Go away!</b>") 25 }); 26 </script> 27 </head> 28 <body> 29 <div id="root"> 30 <div>John</div> 31 <div>Marry</div> 32 <div>Steve</div> 33 </div> 34 35 <h2> 36 This is h2 title text content! 37 </h2> 38 <p></p> 39 40 <div id="foot"> 41 </div> 42 </body> 43 </html>