html 代码 table,HTML DOM Table用法及代码示例

Table对象用于表示HTML

用法:

要访问表元素：

document.getElementById("id");

要创建表对象：

document.createElement("TABLE");

以下示例程序旨在说明Table对象：

示例1：通过使用getElementById()方法访问

table,

td {

border:1px solid green;

}

h1 {

color:green;

}

h2 {

font-family:Impact;

}

body {

text-align:center;

}

GeeksforGeeks

Table Object

Fork Python	Fork Java
Sudo Placement	Fork CPP

Double click the "Delete Row"

button to remove the second row from the table.

Delete Row

function delete() {

// Accessing table object.

var x = document.getElementById("table");

x.deleteRow(0);

}

输出：

单击按钮之前：

单击按钮后：

示例-2：使用document.createElement()方法创建

table {

border:1px solid green;

}

h1 {

color:green;

}

h2 {

font-family:Impact;

}

body {

text-align:center;

}

GeeksforGeeks

Table Object

Double click the "Create" button to create a

TABLE, a Table row and a Table cell element.

Create

function create() {

// Create table object.

var a = document.createElement("TABLE");

a.setAttribute("id", "MyTable");

document.body.appendChild(a);

var b = document.createElement("TR");

b.setAttribute("id", "MyTr");

document.getElementById("MyTable").appendChild(b);

var c = document.createElement("TD");

var d = document.createTextNode("Table cell");

c.appendChild(d);

document.getElementById("MyTr").appendChild(c);

}

输出：

单击按钮之前：

单击按钮后：

支持的浏览器：

Opera

IE浏览器

谷歌浏览器

Firefox

苹果Safari