幸运快三极速快3|极速快3猜大小
您的位置:首頁> 前端教程> JS教程
文章導航

JavaScript deleteCell()

2018-10-27 12:07| 作者: admin| 查看: 764| 評論: 0|來自: 螞蟻部落

此方法可以刪除table中指定的單元格。

語法結構:

[JavaScript] 純文本查看 復制代碼
tablerowObject.deleteCell(index)

參數解析:

(1).tablerowObject:表格對象。

(2).index:可選,表示要刪除td單元格的索引位置,從0開始計算。

瀏覽器支持:

(1).IE瀏覽器支持此方法。

(2).edge瀏覽器支持此方法。

(3).谷歌瀏覽器支持此方法。

(4).opera瀏覽器支持此方法。

(5).火狐瀏覽器支持此方法。

(6).safria瀏覽器支持此屬性。

代碼實例:

[HTML] 純文本查看 復制代碼运行代码
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.iufrl.icu/" />
<title>螞蟻部落</title>
<style type="text/css">
table{
  width:500px;
  height:60px;
  background-color:green;
}
table td{
  background-color:white;
}
</style>
<script>
window.onload=function(){
  let oTable=document.getElementById("tb");
  let obt=document.getElementById("bt");
  obt.onclick=function(){
    oTable.rows[0].deleteCell(1);
  }
}  
</script>  
</head>
<body>
<table cellspacing="1" id="tb">
  <tr>
    <td>螞蟻部落一</td>
    <td>螞蟻部落二</td>
    <td>螞蟻部落三</td>
    <td>螞蟻部落四</td>
    <td>螞蟻部落五</td>
  </tr>
  <tr>
    <td>螞蟻部落一</td>
    <td>螞蟻部落二</td>
    <td>螞蟻部落三</td>
    <td>螞蟻部落四</td>
    <td>螞蟻部落五</td>
  </tr>
</table>
<input type="button" id="bt" value="查看效果"/>
</body>
</html>

上述代碼,點擊按鈕可以刪除第二個單元格,需要注意如下幾點:

(1).deleteCell方法的調用者是tr行對象。

(2).點擊刪除后,不要誤以為是刪除的是最后一個單元格,只是第二個單元格刪除后,后面的填補位置。

相關閱讀:

(1).rows可以參閱JavaScript rows 屬性一章節。

(2).document.getElementById參閱document.getElementById()一章節。


鮮花

握手

雷人

路過

雞蛋

最新評論

返回頂部
幸运快三极速快3 腾讯五分彩软件下载app 竞彩足球总进球数秘籍 75秒极速时时彩规律 凤凰彩票5504登录平台 广东时时技巧稳赚 秒速时时彩是哪个国家 快3开奖江西 湖北税务app缴纳社保 阿拉德之怒mg官网在哪里下载 历史开奖记录全年