JavaScript 操作table,可以新增行和列并且隔一行換背景色代碼分享
更新時(shí)間:2013年07月05日 17:05:21 作者:
這篇文章介紹了JavaScript操作table,可以新增行和列并且隔一行換背景色代碼,有需要的朋友可以參考一下
復(fù)制代碼 代碼如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JavaScript</title>
</head>
<body>
<script language="javascript">
var n = 0;
function showTable(len) {
wi('<table border="1" width="300" style="border-collapse:collapse"><tbody id="table">');
for (i=0;i<len;i++) {
if (parseInt(i%2)==1) {
bg = '#F4FAC7';
} else {
bg = 'white';
}
wi('<tr bgcolor='+bg+'><td>第'+(i+1)+'行</td></tr>');
}
wi('</tbody></table><br />');
wi('<input type="button" value="Add" id="add" />');
}
function wi(str) {
return document.write(str);
}
showTable(10);
var add = document.getElementById("add");
add.onclick = function() {
n = n+1;
if (n%2==0) {
bg = '#F4FAC7';
} else {
bg = 'white';
}
var table = document.getElementById("table");
var tr = document.createElement("tr");
tr.bgColor = bg;
var td = document.createElement("td");
td.innerHTML = '第'+(10+n)+'行';
tr.appendChild(td);
table.appendChild(tr);
}
</script>
</body>
</html>
您可能感興趣的文章:
- javascript設(shè)置頁(yè)面背景色及背景圖片的方法
- js獲取及修改網(wǎng)頁(yè)背景色和字體色的方法
- JavaScript實(shí)現(xiàn)點(diǎn)擊按鈕切換網(wǎng)頁(yè)背景色的方法
- JS實(shí)現(xiàn)點(diǎn)擊按鈕控制Div變寬、增高及調(diào)整背景色的方法
- JS實(shí)現(xiàn)進(jìn)入頁(yè)面時(shí)漸變背景色的方法
- js獲得網(wǎng)頁(yè)背景色和字體色的方法
- javascript修改表格背景色實(shí)例代碼分享
- javascript學(xué)習(xí)筆記(二) 鼠標(biāo)經(jīng)過時(shí),改變div塊的背景色的代碼
- js實(shí)現(xiàn)GridView單選效果自動(dòng)設(shè)置交替行、選中行、鼠標(biāo)移動(dòng)行背景色
- 用javascript css實(shí)現(xiàn)GridView行背景色交替、鼠標(biāo)劃過行變色,點(diǎn)擊行變色選中
- JavaScript實(shí)現(xiàn)點(diǎn)擊單元格改變背景色的方法
相關(guān)文章
玩轉(zhuǎn)JavaScript OOP - 類的實(shí)現(xiàn)詳解
下面小編就為大家?guī)?lái)一篇玩轉(zhuǎn)JavaScript OOP - 類的實(shí)現(xiàn)詳解。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2016-06-06js實(shí)現(xiàn)類似于add(1)(2)(3)調(diào)用方式的方法
這篇文章主要介紹了js實(shí)現(xiàn)類似于add(1)(2)(3)調(diào)用方式的方法,需要的朋友可以參考下2015-03-03json數(shù)據(jù)處理技巧(字段帶空格、增加字段、排序等等)
json數(shù)據(jù)處理技巧例如:正常取值、字段帶空格、賦值、增加字段、排序、拷貝、數(shù)組添加和刪除等,詳細(xì)請(qǐng)參考本文或許對(duì)你有所幫助2013-06-06JavaScript中實(shí)現(xiàn)new的兩種方式引發(fā)的探究
眾所周知JS中new的作用是通過構(gòu)造函數(shù)來(lái)創(chuàng)建一個(gè)實(shí)例對(duì)象,這篇文章主要給大家介紹了關(guān)于JavaScript中實(shí)現(xiàn)new的兩種方式引發(fā)的相關(guān)資料,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05