点灯游戏的html编程,index.html

#table{

margin: auto;

}

td {

background-color: #9A9A9A;

}

.td1 {

background-color: #FFFFFF;

}

#show {

margin: auto;

border: 1px solid aqua;

height: 100px;

width: 300px;

line-height: 100px;

font-size: 40px;

font-weight: bold;

text-align: center;

color: coral;

background-color: #00FFFF;

font-family: "微软雅黑";

display: none;

}

恭喜过关

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

var num = 3

var tds;

creatTable();

function creatTable() {

table.innerHTML = "";

for(var i = 0; i < num; i++) {

var row = table.insertRow();

for(var k = 0; k < num; k++) {

row.insertCell();

}

tds = table.getElementsByTagName("td");

}

for(var i = 0; i < tds.length; i++) {

tds[i].onclick = function() {

var rowindex = this.parentNode.rowIndex;

var cellindex = this.cellIndex;

for(var i = 0; i < tds.length; i++) {

if(tds[i].parentNode.rowIndex == rowindex || tds[i].cellIndex == cellindex) {

if(tds[i].className) {

tds[i].className = "";

} else {

tds[i].className = "td1";

}

}

}

getFullTable();

}

}

}

function getFullTable() {

var ischenggong = true;

for(var i = 0; i < tds.length; i++) {

if(tds[i].className == "") {

ischenggong = false;

break;

}

}

if(ischenggong) {

document.getElementById("show").style.display = "block";

setTimeout(function() {

num++;

creatTable();

document.getElementById("show").style.display = "none";

}, 2000)

}

}

一键复制

编辑

Web IDE

原始数据

按行查看

历史