динамическое создание тадлицы
как создать таблицу с помощью createElement и заполнить её полями?
|
какими полями?
|
я имал ввиду добавить в неё <tr> и <td>
но с этим я разобрался уже) но теперь другая проблемма.. почему в ие неработает вариант <input type="submit" value="Create" name="create" onclick="create_control()" /> <script language="JavaScript" type="text/javascript"> function create_control() { var e; e=document.createElement('table'); e.setAttribute("width","100"); e.setAttribute("height","100"); e.setAttribute("border","1"); e.style.position = 'absolute'; document.body.appendChild(e); } </script> а в опере и лисе пашет |
потому что таблица в ИЕ должна содержать tbody в обязательном порядке.
Используй table.insertRow(number) и table.rows[number].inserCell(number2) для вставки строк и ячеек (в строки). Тогда не надо думать о добавлении tbody, так как он создастся автоматически. Это родные методы таблицы и они работают быстро. |
спасибо, буду пробовать
|
чёт неполучается вставить...
e.table.insertRow(1) |
e.insertRow(-1); // если -1, то вставляется в конец |
а параметры ровов и целов как задать тогда?
и кстати всё равно неработает |
var table = document.createElement('table'); var row = table.insertRow(0); var cell = row.insertCell(0); cell.innerHTML = 'йа ячейго'; document.body.appendChild(table); или var table = document.createElement('table'); var row = table.insertRow(-1); var cell = row.insertCell(-1); cell.innerHTML = '111'; var row = table.insertRow(-1); var cell = row.insertCell(-1); cell.innerHTML = '222'; document.body.appendChild(table); |
о, пасибо .. теперь пашет во всех браузерах
|
при создании динамической таблицы почемуто неполучается указать свойства целспэйсин и целпаддинг
вот код var vjtwindow; function create_control() { if (!vjtwindow) { vjtwindow=document.createElement("table"); vjtwindow.setAttribute("cellpadding","0"); vjtwindow.setAttribute("cellspacing","0"); vjtwindow.setAttribute("id","vij-table"); var newRow=vjtwindow.insertRow(0); var newCell = newRow.insertCell(0); newCell.setAttribute("align", "right"); newCell.innerHTML="<img src=\"skins/standart/images/21.png\" border=\"0\"/>"; var newCell = newRow.insertCell(1); newCell.setAttribute("id","vjt-table-top"); newCell.innerHTML=""; var newCell = newRow.insertCell(2); newCell.setAttribute("align","left"); newCell.innerHTML="<img src=\"skins/standart/images/24.png\" border=\"0\"/>"; var newRow=vjtwindow.insertRow(1); var newCell = newRow.insertCell(0); newCell.innerHTML="<img src=\"skins/standart/images/29.png\" border=\"0\"/>"; var newCell = newRow.insertCell(1); newCell.setAttribute("id","vjt-table-bottom"); newCell.innerHTML=""; var newCell = newRow.insertCell(2); newCell.setAttribute("align","right"); newCell.innerHTML="<img src=\"skins/standart/images/28.png\" border=\"0\"/>"; var newRow=vjtwindow.insertRow(1); var newCell = newRow.insertCell(0); newCell.setAttribute("id","vjt-table-left"); newCell.innerHTML=""; var newCell = newRow.insertCell(1); newCell.setAttribute("id","vjt-tab"); newCell.setAttribute("vlign","top"); newCell.innerHTML="<b>23</b>"; var newCell = newRow.insertCell(2); newCell.setAttribute("align","right"); newCell.setAttribute("id","vjt-table-right"); newCell.innerHTML=""; document.body.appendChild(vjtwindow); } } а именно по какойто причине vjtwindow.setAttribute("cellpadding","0"); vjtwindow.setAttribute("cellspacing","0"); не оказывает никакого воздействия, пробовал закинуть в css но всёравно невыходит.. |
vjtwindow.cellPadding = 0; vjtwindow.cellSpacing = 0; newCell.setAttribute("id","vjt-table-right"); зачем??? newCell.id = "vjt-table-right"; короче почти в 2 раза!!! |
хм.. чёт не подумал..
а за подсказку пасиб |
Здесь подробно расписано как программно строить и менять таблицы. Работает в IE, Firefox и Opera
|
создаю таблицу, в принципе, стандартным методом:
var table = document.createElement('table'); table.style.borderCollapse = 'collapse' table.style.position = "absolute" table.style.width = xlen*cellwd+'px' table.style.height = ylen*cellhg+'px' table.style.borderWidth = '0px' table.style.borderStyle = 'solid' table.id=tid for (var k = 0; k < 50; k++) { var row = table.insertRow(-1); for (var j = 0; j < 50; j++) { var cell = row.insertCell(-1); cell.style.width = cellwd+'px' cell.style.height = cellhg+'px' cell.style.borderWidth = '1px' cell.style.borderStyle = 'solid' cell.style.borderColor = '#cccccc' cell.innerHTML = " "; } однако, после выполнения кода браузер начинает дико нагружать процессор. возможно, я что-то неправильно делаю? firefox 3.5.1 |
Часовой пояс GMT +3, время: 11:05. |