Hướng dẫn append data to table javascript - nối dữ liệu vào bảng javascript
Tôi đang cố gắng thêm nhiều dữ liệu vào bảng bên dưới bằng JavaScript. Show
style.js được sử dụng dưới đây:
| ";
}
Client Name |
---|
James Bond 007 |
Bạn đã đi đúng đường, nhưng một lưu ý quan trọng là bạn đang cố gắng sử dụng một div bên trong bảng. Một bảng có cấu trúc rất cụ thể phải được khớp nếu bạn muốn nó hiển thị đúng.
Bạn có thể đặt các phần tử div bên trong TD hoặc TH, nhưng không phải bên trong chính phần tử bảng. Kiểm tra liên kết này: https://developer.mozilla.org/en-us/docs/web/html/element/table
Đã trả lời ngày 25 tháng 10 năm 2018 lúc 21:08Oct 25, 2018 at 21:08
Bạn có thể sử dụng danh sách để phù hợp với những gì bạn cần ở đây là mã
Home Page
Client Name
- James Bond 007
và mã chức năng sử dụng addData () như `function addData () {
var mylist=document.getElementById("mylist");
var personName=document.getElementById("personName").value;
var node = document.createElement("LI");
var textnode = document.createTextNode(personName);
node.appendChild(textnode);
mylist.appendChild(node);
}`
Tôi hy vọng cái này sẽ giúp bạn :)
Đã trả lời ngày 25 tháng 10 năm 2018 lúc 21:27Oct 25, 2018 at 21:27
AbdelzaherabdelzaherAbdElzaher
1042 huy hiệu bạc5 huy hiệu đồng2 silver badges5 bronze badges
Bạn có thể sử dụng một cách tiếp cận tương tự như những gì bạn đang cố gắng: nhận được ____1010, nối thêm một số HTML mới, sau đó thay thế bên trong. Nhưng, bạn cần phải có được
function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
0 của function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
2 của bạn (không phải là yếu tố bạn lồng bên trong nó).Ví dụ: đã thay thế
function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
3 function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
4 của bạn bằng trình nghe sự kiện).const personName = document.getElementById('personName');
const appendButton = document.getElementById('appendButton');
const nameTable = document.getElementById('nameTable');
appendButton.addEventListener('click', (event) => {
let content = nameTable.innerHTML;
content += '' + personName.value + ' ';
nameTable.innerHTML = content;
});
Client Name
James Bond 007
Tùy thuộc vào sự phức tạp của những gì bạn đang làm, có thể đi nhanh hơn để đi theo tuyến
function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
5 / function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
6 được đề xuất trong các câu trả lời khác nếu bạn cũng sử dụng function addData(){
var personName = document.getElementById("personName").value;
//console.log(personName);
var getOlderInformation = document.getElementById("addDataHere").innerHTML;
document.getElementById("addDataHere").innerHTML = getOlderInformation + "" + personName + " ";
}
7. Một vi dụ khac:appendButton.addEventListener('click', (event) => {
const frag = document.createDocumentFragment();
const tr = document.createElement('tr');
const td = document.createElement('td');
td.appendChild(document.createTextNode(personName.value));
tr.appendChild(td);
frag.appendChild(tr);
nameTable.appendChild(frag);
});
Client Name
James Bond 007
Đã trả lời ngày 25 tháng 10 năm 2018 lúc 21:11Oct 25, 2018 at 21:11
Benvcbenvcbenvc
Huy hiệu vàng 14K431 Huy hiệu bạc51 Huy hiệu đồng4 gold badges31 silver badges51 bronze badges