|
|
Регистрация Восстановить пароль |
Повторная активизация e-mail |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
21.01.2017, 15:22 | #1 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 18
|
Добавить строку в таблицу
Здравствуйте!
Код добавления строки в таблицу: Код HTML:
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1251"> <title> Table </title> <style> table {table-layout: fixed; width: 300px; /* Ширина таблицы */ margin: auto; } td {width: 100%; text-align: center;} </style> <script> function addRow() { var tableBody=document.getElementById("tableBody"); var newRow=document.createElement("tr"); var newCell=document.createElement("td"); newCell.innerHTML="123" for (var i=0; i<3; i++) newRow.appendChild(newCell); tableBody.appendChild(newRow); } </script> </head> <body> <input type="Button" value="Push me!" onclick="addRow()"> <table> <tbody id="tableBody"> <tr> <td>№ </td> <td>x </td> <td>y </td> </tr> </tbody> </table> </body> </html> Свойство innerHTML тегов <TR>, вероятно, не readOnly, т.к. при открытии в отладчике свойств DOM без проблем редактирую св-во innerHTML, в т.ч. добавляю ячейки? Заранее благодарю за ответ! |
21.01.2017, 17:16 | #2 |
Раздолбайских Дел
Старожил
Регистрация: 22.05.2009
Сообщений: 3,828
|
Потому что ты 3 раза одну и ту же ячейку засовываешь в одну и ту же строку.
Alar, верни репу!
|
21.01.2017, 17:56 | #3 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 18
|
Благодарю за ответ!
Т.е. требуется создавать массив объектов добавляемых ячеек? |
21.01.2017, 18:25 | #4 |
Раздолбайских Дел
Старожил
Регистрация: 22.05.2009
Сообщений: 3,828
|
Зачем? Штампуй на ходу.
Можешь клонировать эталон, неважно, главное чтобы это были разные объекты. Можно и в массив, но я смысла не вижу.
Alar, верни репу!
|
21.01.2017, 20:48 | #5 | |
Пользователь
Регистрация: 15.04.2010
Сообщений: 18
|
Благодарю за ответ!
Цитата:
Пока решил так: Код HTML:
var newRow=document.createElement("tr"); newRow.innerHTML="<td>123</td><td>123</td><td>123</td>" |
|
22.01.2017, 00:04 | #6 | |
Раздолбайских Дел
Старожил
Регистрация: 22.05.2009
Сообщений: 3,828
|
Цитата:
Код:
Он запускает текстовый парсер, в то время как добавление объектов через DOM в данном случе будет работать значительно быстрее. Еще быстрее будет работа через API documentFragment. Если интересно, поищи лекции на тему от webStandartDays, по-моему, Вадим Макеев про это говорил еще где-то в 2012 году. т.е. Твой первый код был идеологически правильней, просто ты не понял как оно делается. .createElement тебе создает один экземпляр дом-узла, и ты его трижды пихаешь в одну строку. Если ты его потом приаппендишь в другое место, то он уберется из этой строки и появится там, куда ты его заслал. Чтобы добавить 3 элемента, тебе нужно создать 3 элемента и их добавлять. ООП, мать его) плохой, но действенный выход.
Alar, верни репу!
|
|
22.01.2017, 09:42 | #7 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 18
|
Благодарю за помощь!
Добавил параметр deep=true для клонирования установленных атрибутов. PHP код:
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Добавить строку в таблицу | ольгаг | Microsoft Office Access | 2 | 24.04.2016 18:14 |
Добавить строчку в таблицу | Predator199 | C# (си шарп) | 25 | 14.03.2015 12:01 |
Не могу добавить строку в таблицу | Lost7070 | PHP | 1 | 16.12.2014 08:25 |
Добавить в таблицу | Наталья Баева | SQL, базы данных | 0 | 15.02.2014 21:19 |
Добавить строку в таблицу с объединенными ячейками | Stilet | Microsoft Office Word | 3 | 03.08.2012 13:09 |