#javascript #html
Вопрос:
В приведенном ниже коде я пытаюсь создать две динамические таблицы HTML, но это не работает. Одна таблица с идентификатором «Таблица» и другая с идентификатором «Таблица».
<script type="text/javascript">
function Upload() {
const columns = [0, 3] // represents allowed column 1 and 3 in index form
const dccolumns = [0, 3] // represents allowed column 1 and 3 in index form
var fileUpload = document.getElementById("fileUpload");
var regex = /^([a-zA-Z0-9s_\.-:]) (.csv|.txt)$/;
if (regex.test(fileUpload.value.toLowerCase())) {
if (typeof (FileReader) != "undefined") {
var reader = new FileReader();
reader.onload = function (e) {
var table = document.createElement("table");
table.id = 'table'
var tabledc = document.createElement("tabled");
tabled.id = 'tabled'
var rows = e.target.result.split("n");
for (var i = 0; i < rows.length; i ) { var cells = rows[i].split(","); if (cells.length > 1) {
var row = table.insertRow(-1);
for (var j = 0; j < cells.length; j ) {
// ignore columns that are not allowed
if (!columns.includes(j)) {
continue
}
var rc = cells[j];
if (rc == "SUMMARY") {
var cell = row.insertCell(-1);
cell.innerHTML = cells[j];
alert(rc);
}
}
}
}
var dvCSV = document.getElementById("dvCSV");
dvCSV.innerHTML = "";
dvCSV.appendChild(table);
var alld = document.getElementById("alld");
alld.innerHTML = "";
alld.appendChild(tabled);
}
reader.readAsText(fileUpload.files[0]);
} else {
alert("This browser does not support HTML5.");
}
} else {
alert("Please upload a valid CSV file.");
}
}
Когда я запускаю приведенный выше код, он просто обновляет таблицу в «Таблице», но не в «Таблице». Я не уверен, что делаю здесь что-то не так.
Спасибо
Комментарии:
1. можете ли вы добавить HTM-код сюда ? трудно понять, что есть в HTML
2.
document.createElement("tabled")
создает<tabled></tabled>
3. У вас опечатка в определении переменной
tabledc
. Вы пишетеvar tabledc
, но продолжаете использоватьtabled
. Я думаю, что это просто ошибка копирования и вставки. Пожалуйста, также предоставьте содержимое csv — файла.4. Как упоминал Тревор Кропп, вы создаете
<tabled></tabled>
элемент, который не является таблицей. Но , кроме того, вы, похоже, никогда не добавляете никакого контентаtabled
, только вtable
. Это может стать более понятным, если вы будете использовать devtools для отладки кода и пошагового просмотра каждой строки, отслеживая ее эффекты.5. Спасибо всем вам. Это решило проблему. Как мне принять ответ Тревора?