--------------------------------- 題記
在開發過程中,由於錯誤的操作table、tr、td標籤的父子關係,浪費了很多時間。最後寫測試發現在該情況下table、tr、td並不是父子關係。
--------------------------------- 代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<table id="table" border="1">
<tr id="1"><td id="td">aaa</td></tr>
<tr id="2"><td>bbb</td></tr>
<tr id="3"><td>ccc</td></tr>
<tr id="4"><td>ddd</td></tr>
</table>
<div id="div">
<div id="1">1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
</body>
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript">
//table是一體,並不是父子關係的情況
// $("table").children().each(function(index) {
// alert(this);
// alert($(this).html("hahaha"));
// });
//是父子關係
// alert($("tr").parents("table").attr("id"));
// alert($("#td").parents("tr").attr("id"));
alert($("table").children(":first").attr("id"));
$("table tr").not(":first").not(":last").html('<p>111</p>');
alert($("#div").children(":first").attr("id"));
</script>
</html>