Teilen Sie einen Code zum Schreiben einer Variablentabelle mit js-js-Tutorial-php.cn

Teilen Sie einen Code zum Schreiben einer Variablentabelle mit js

PHPz

Freigeben： 2017-04-04 14:09:01

Original

1450 Leute haben es durchsucht

Dieser Artikel enthält einen Code zum Schreiben einer Variablentabelle mit js. Ich hoffe, er ist für alle hilfreich!

table.html

<html>
<head>
    <title>js table</title>
    <meta charset="utf-8">
<script  src="js.js"></script>
</head>
<body>
    <button onclick="jianbiao()">创建表格</button>
    <button onclick="jianhang()">添加行</button>
</body>
</html>

Nach dem Login kopieren

js.js

/**************************************
任务：
    1.创建Table，并将Table添加到Body当中
    2.向Table中添加行TableRow
    3.向TableRow中添加单元格TableCell
    4.在TableCell中，添加innerHTML的内容，比如数字，文本，编辑框，按钮等
    5.从table中删除一行
    6.可视化编辑TableRow中的内容

***************************************/
 function jianbiao() {
// body...
var mytable=document.createElement('table');
mytable.border='1';
mytable.id='mytable';
document.body.appendChild(mytable);
var row=mytable.insertRow(0);
var cell1=row.insertCell(0);
cell1.innerHTML="描述1";
var cell2=row.insertCell(1);
cell2.innerHTML="描述1";
var cell3=row.insertCell(2);
cell3.innerHTML="描述1";
var cell4=row.insertCell(3);
cell4.innerHTML="描述1";
}
function jianhang(){
var mytable=document.getElementById('mytable');
var rowCount=mytable.rows.length;
var row=mytable.insertRow(rowCount);
var cell1=row.insertCell(0);
cell1.innerHTML="这个单元格的坐标是(0,"+ rowCount +")";
var cell2=row.insertCell(1);
cell2.innerHTML="(1,"+ rowCount +")";
var cell3=row.insertCell(2);
cell3.innerHTML="<input type=&#39;text&#39; />";
var cell4=row.insertCell(3);
cell4.innerHTML="<button onclick=&#39;gengxin(this.parentNode.parentNode.rowIndex)&#39;/>修改</button><button onclick=&#39;delet(this.parentNode.parentNode.rowIndex)&#39;>删除</button>";
}
function gengxin (argument) {
var mytable=document.getElementById('mytable');
var row=mytable.rows[argument];
var cell=row.cells[1];
cell.innerHTML="修改之后";
}
function delet (argument) {
    var mytable=document.getElementById('mytable');
    mytable.deleteRow(argument);
}

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonTeilen Sie einen Code zum Schreiben einer Variablentabelle mit js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!