HTML DOM insertCell() ·½·¨

¶¨ÒåºÍÓ÷¨

insertCell() ·½·¨ÓÃÓÚÔÚ HTML ±íµÄÒ»ÐеÄÖ¸¶¨Î»ÖòåÈëÒ»¸ö¿ÕµÄ <td> ÔªËØ¡£

Óï·¨

tablerowObject.insertCell(index)

·µ»ØÖµ

Ò»¸ö TableCell ¶ÔÏ󣬱íʾд´½¨²¢±»²åÈëµÄ <td> ÔªËØ¡£

˵Ã÷

¸Ã·½·¨½«´´½¨Ò»¸öÐ嵀 <td> ÔªËØ£¬°ÑËü²åÈëÐÐÖÐÖ¸¶¨µÄλÖá£Ðµ¥Ôª¸ñ½«±»²åÈ뵱ǰλÓÚ index Ö¸¶¨Î»ÖõıíԪ֮ǰ¡£Èç¹û index µÈÓÚÐÐÖеĵ¥Ôª¸ñÊý£¬Ôòе¥Ôª¸ñ±»¸½¼ÓÔÚÐеÄĩβ¡£

Çë×¢Ò⣬¸Ã·½·¨Ö»ÄܲåÈë <td> Êý¾Ý±íÔª¡£ÈôÐèÒª¸øÐÐÌí¼ÓÍ·±íÔª£¬±ØÐëÓà Document.createElement() ·½·¨ºÍ Node.insertBefore() ·½·¨£¨»òÏà¹ØµÄ·½·¨£©´´½¨²¢²åÈëÒ»¸ö <th> ÔªËØ¡£

Å׳ö

Èô²ÎÊý index СÓÚ 0 »ò´óÓÚµÈÓÚÐÐÖеĵıíÔªÊý£¬¸Ã·½·¨½«Å׳ö´úÂëΪ INDEX_SIZE_ERR µÄ DOMException Òì³£¡£

ʵÀý

ÏÂÃæµÄÀý×ÓÔÚ±í¸ñÐÐÖвåÈëÁËÒ»¸öµ¥Ôª¸ñ£º

<html>
<head>
<script type="text/javascript">
function insCell()
  {
  var x=document.getElementById('tr2').insertCell(0)
  x.innerHTML="John"
  }
</script>
</head>
<body>

<table border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="insCell()" value="Insert cell">

</body>
</html>
VUE