Раскрасить ячейки таблицы, созданной через JS
Нужно раскрасить ячейки таблицы путем выбора случайных оттенков в HEX из массива. Но код на работает. В чем ошибка не могу понять. Заранее благодарен за помощь!
<script>
var colorArray = ["#CD5C5C", "#7FFF00", "#228B22", "#FFA07A", "#FFFF00", "#008B8B", "#4682B4", "#FFA500", "#0000FF", "#D2691E"];
;(function () {
function drawTable(row, col) {
var elem = document.getElementById('colorId');
var num;
var html = "<table>";
for (var i = 0; i < row; i++) {
html += "<tr>";
for (var j = 0; j < col; j++) {
html += "<td id='colorId'>";
num = Math.round(Math.random() * 5);
elem.style.background = colorArray[num];
html += "</td>";
}
html += "</tr>";
}
html += "</table>";
return html;
}
var columns = prompt("Введите кол-во колонок");
while (isNaN(columns) || columns < 1 || columns * 10 % 10 !== 0) {
columns = prompt("Некорректные данные! Введите кол-во колонок");
}
var rows = prompt("Введите кол-во строк");
while (isNaN(rows) || rows < 1 || rows * 10 % 10 !== 0) {
rows = prompt("Некорректные данные! Введите кол-во строк");
}
document.write(drawTable(rows, columns));
})();
</script>
|
DVV,
строки 7 и 17 зачем в вашем коде elem - создавали строку, так создавайте. строки 7 и 17 выкинуть, строку 15 переписать,строки 15 - 16 поменять местами |
DVV,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
td{
height: 50px;
width: 50px;
}
table {
border-collapse: collapse;
}
</style>
</head>
<body>
<script>
var colorArray = ["#CD5C5C", "#7FFF00", "#228B22", "#FFA07A", "#FFFF00", "#008B8B", "#4682B4", "#FFA500", "#0000FF", "#D2691E"];
;(function () {
function drawTable(row, col) {
var num;
var html = "<table>";
for (var i = 0; i < row; i++) {
html += "<tr>";
for (var j = 0; j < col; j++) {
num = Math.floor(Math.random() * colorArray.length);
html += "<td style='background-color: "+colorArray[num]+";'>";
html += "</td>";
}
html += "</tr>";
}
html += "</table>";
return html;
}
var columns = prompt("Введите кол-во колонок");
while (isNaN(columns) || columns < 1 || columns * 10 % 10 !== 0) {
columns = prompt("Некорректные данные! Введите кол-во колонок");
}
var rows = prompt("Введите кол-во строк");
while (isNaN(rows) || rows < 1 || rows * 10 % 10 !== 0) {
rows = prompt("Некорректные данные! Введите кол-во строк");
}
document.write(drawTable(rows, columns));
})();
</script>
</body>
</html>
|
Спасибо большое! Все работает)))
|
| Часовой пояс GMT +3, время: 13:35. |