使用 jQuery() 操作 DOM 对象要注意的小问题
浏览数：15 /
时间：2015年06月09日
js 里使用 document.getElementById("theid") 来获得 dom 对象，例如：
document.getElementById("table1") 就可以获取到 id 为 table1 的对象，就可以直接
document.getElementById("table1") .rows.length 来获得行数。
使用 $() 可以简写代码，如：
$("#table1")。但这样获取到的不是 dom 对象，通过 alert 打印出来的 是 object 而不是 Html的Table。
所以$("#table1").rows.length 是错误的。
正确的使用应该是：$("#table1")[0].rows.length;
$("#table1") 会获取到所有的 id 为 table1 的对象。
测试：
<body>
<div id="div1" class="divpos">
<form id="form1">
id: <input type="text" class="id" name="id" /><br />
name: <input type="text" class="name" name="name"/><br />
number:<input type="text" class="number" name="number"/><br />
<input type="button" value="添加" onclick="AddRow()"/>
</form>
</div>
<div id="div2" class="divpos">
<table border="1" id="table1">
<tr><th>id</th><th>name</th><th>number</th></tr>
</table>
</div>
</body><script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function AddRow() {
//var count = document.getElementById("table1").rows.length;
//获取table的行数
var count = $("#table1")[0].rows.length;
//在指定位置插入一行
var row = $("#table1")[0].insertRow(count);
//在行的指定位置插入单元格
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
cell1.innerText = $(".id")[0].value;
cell2.innerText = $(".name")[0].value;
cell3.innerText = $(".number")[0].value;
$(".id").val(""); $(".name").val(""); $(".number").val("");
}
</script>
前端的东西还是弄得比较少，js 代码写得不多，比较生疏。要找个时间补补。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
