i dont understand where i miss-tack when i run this code show the error in console ( TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'. ) can you tell me how can i solve this problem ?
import axios from "axios";
const BASE_url = " http://localhost:3000/contacts";
window.onload = () => {
const mytbody = document.querySelector("#mytbody");
axios
.get(BASE_url)
.then(res => {
res.data.forEach(function(contact) {
createTDelement(contact, mytbody);
});
})
.catch(err => console.log(err));
};
function createTDelement(contact, perentElement) {
const tr = document.createElement("tr");
const tdId = document.createElement("td");
tdId.innerHTML = contact.tdId;
tr.appendChild(tdId);
var tdName = document.createElement("td");
tdName.innerHTML = contact.name;
tr.appendChild(tdName);
const tdEmail = document.createElement("td");
tdEmail.innerHTML = contact.email;
tr.appendChild(tdEmail);
const tdPhone = document.createElement("td");
tdPhone.innerHTML = contact.phone ? contact.phone : "N/A";
tr.appendChild(tdPhone);
const tdAction = document.createElement("td");
const editBtn = document.createElement("button");
editBtn.className = "btn btn-warning";
editBtn.innerHTML = "Edit";
editBtn.addEventListener("click", () => {
console.log("i am editable");
});
tdAction.appendChild(editBtn);
const deleteBtn = document.createElement("button");
deleteBtn.className = "btn btn-danger";
deleteBtn.innerHTML = "Delete";
deleteBtn.addEventListener("click", () => {
console.log("i am editable");
});
tdAction.appendChild("deleteBtn");
perentElement.appendChild("tr");
}
最佳答案
perentElement.appendChild("tr");
和tdAction.appendChild("deleteBtn")
将尝试将字符串“tr”和“deleteButton”作为子级添加到perentElement
/tdAction
中。因为字符串不是NodeElement
,所以您会收到此错误。您不能使用appendChild()
方法将字符串作为子项附加到DOM元素。
在这里进一步阅读:https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild#Returns
关于javascript - 我尝试过此控制台问题。 TypeError : Failed to execute 'appendChild' on 'Node' : parameter 1 is not of type 'Node' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54793870/