Сообщение от MallSerg
|
Ты в это веруешь?
или способен показать наглядно преимущество?
|
Я никогда и ни во что не верую. Именно поэтому я и задал вопрос warren buffet, на который до сих пор не получил внятного ответа, ни единого аргумента в пользу insertRow кроме каких-то глупых ссылок и бестолкового хамства.
С мое стороны аргументы простые:
1) cloneNode + AppendChild позволяет не создавать в цикле ячейки через insertCells, ячейки просто копируются из любой строки
2) Скорость. Я провел тесты. Создайте в HTML таблицу с десятью колонками и одной строкой. Теперь проверьте работу двух алгоритмов: сначала попробуйте создать какое-либо большое количество строк с помощью InsertRows + insertCells, заполнив их какими-нибудь данными, ну например цифрами с 1 по 10 по номеру колонок. А затем то же количество колонок с помощью cloneNode и appendChild, также заполняя их содержимым. Я получил разницу в разы в пользу второго варианта.
Мой код:
<html>
<head>
</head>
<body>
<table>
<THEAD><TR><TH>Man</TH><TH>Woman</TH><TH>Girl</TH><TH>Boy</TH><TH>Dog</TH>
<TH>Man</TH><TH>Woman</TH><TH>Girl</TH><TH>Boy</TH><TH>Dog</TH></TR></THEAD>
<TBODY>
<TR><TD>Ivan</TD><TD>Maria</TD><TD>Olga</TD><TD>Victor</TD><TD>Sharic</TD>
<TD>Ivan</TD><TD>Maria</TD><TD>Olga</TD><TD>Victor</TD><TD>Sharic</TD></TR>
</TBODY>
</table>
<input type = button onclick = "throughInsert()" value = Insert />
<input type = button onclick = "throughAppend()" value = Append />
</body>
</html>
<script type="text/javascript">
var cnt = 10000;
function throughInsert()
{
table = document.querySelector("TABLE");
for(i = 2; i < cnt; i++)
{
row = table.insertRow(i);
row.insertCell().innerHTML = i;
for(j = 2; j<11; j++)
{
row.insertCell().innerHTML = j;
}
}
alert("finish");
}
function throughAppend()
{
tbody = document.querySelector("TABLE TBODY");
rowPatt = tbody.querySelector("TR");
for(i = 1; i < cnt; i++)
{
row = rowPatt.cloneNode(true);
row.cells[0].innerHTML = i;
for(j = 2; j<11; j++)
{
row.cells[j - 1].innerHTML = j;
}
tbody.appendChild(row);
}
alert("finish");
}
</script>