<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$(":button[value=click]").click(function () {
confiirm();
});
});
function confiirm() {
// 若Dom對象中存在class爲td的元素就不進行創建
if ($(".td").length > 0) {
return;
};
var json = [
{ "name": "xiaohua", "age": "21" },
{ "name": "xiaozhang", "age": "31" },
{ "name": "xiaoming", "age": "17" },
{ "name": "xiaojun", "age": "26" }
];
var $table = $("<table></table>");
$table.attr("border", "1px");
$.each(json, function () {
// json 對象
var $tr = $("<tr><td class='td'>" + this.name + ":" + this.age + "</td></tr>");
// // 給td註冊事件的標準寫法2 $("td", $tr)：相對定位
// var $td = $("td", $tr).click(function () {
// alert('在$tr對象中找');
// });
// 給td註冊事件的標準寫法3 children();
$tr.children("td").click(function () {
alert('通過孩子去找');
});
$table.append($tr);
});
$("#cont").append($table);
// // 給td 註冊事件1 (必須才append()之後才能通過id或者class去獲取，不推薦使用)
// $(".td").click(function () {
// alert('hah');
// });
}
</script>
</head>
<body>
<div id="cont"></div>
<input type="button" value="click" />
</body>
</html>