перенос на следующую строку
Добрый вечер.Есть скрипт,который добавляет товары на экран,добавляет он их в таблицу,и в строчку,нужно,чтобы когда уже было выведено 8 товаров на экран,9 товар начинался с новой строки,то есть нужен тег <tr>
Мой скрипт. function addRow(id, value){ var tbody = document.getElementById(id).getElementsByTagName("TBODY")[0]; var td1 = document.createElement("TD") td1.classList.add('border', 'price_class'); td1.appendChild(document.createTextNode(value)) tbody.appendChild(td1); } addRow('priceTable', this.textContent); |
А где здесь TR? И как ячейку можно вставить в TBODY (tbody.appendChild(td1))?
|
Как-то вставилась)
|
Сам не знаю,как
|
Цитата:
|
SolomonRei,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> td{ width: 50px; border: 1px solid #000000; text-align: center; } table{ border-collapse: collapse; } </style> </head> <body> <table id="priceTable"><tbody></tbody></table> <script> function addRow(id, value){ var tbody = document.getElementById(id).getElementsByTagName("TBODY")[0]; var tr = tbody.querySelector("tr:last-child"); if(!tr || tr.cells.length == 8) tr = tbody.insertRow(-1); var td1 = document.createElement("TD") td1.classList.add('border', 'price_class'); td1.appendChild(document.createTextNode(value)) tr.appendChild(td1); } for (var i = 1; i < 12; i++) { addRow('priceTable', i); } </script> </body> </html> |
SolomonRei, и td1.classList.add('border', 'price_class') лишнее, ведь если заполняется одна таблица, то сразу прописать стили для ее ячеек в CSS, и даже если таблица имеет несколько TBODY, а ячейки товаров добавляются в первое, то для ячеек первой TBODY таблицы с классом "name".
|
Часовой пояс GMT +3, время: 16:54. |