createTextNode
<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
</head>
<body>
<table border="1">
<thead>
<th>Name</th>
<th>Color</th>
</thead>
<tbody id="myBody">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</tbody>
</table>
<button id="add">Add Element</button>
<button id="remove">Remove Element</button>
<script>
var tableBody = document.getElementById("myBody");
document.getElementById("add").onclick = function() {
var row = tableBody.appendChild(document.createElement("tr"));
row.setAttribute("id", "newrow");
row.appendChild(document.createElement("td")).appendChild(document.createTextNode("X"));
row.appendChild(document.createElement("td")).appendChild(document.createTextNode("Y"));
};
document.getElementById("remove").onclick = function() {
var row = document.getElementById("newrow");
row.parentNode.removeChild(row);
}
</script>
</body>
</html>
Home
JavaScript Book
DOM
JavaScript Book
DOM
HTMLElement:
- The HTMLElement Members
- element tag name, id, direction, language, hidden disabled information
- addEventListener
- appendChild
- attributes returns a collection containing all of the attributes
- classList
- className
- cloneNode
- createElement
- createTextNode
- dataset
- getAttribute
- getElementsByTagName
- hasAttribute
- innerHTML
- insertAdjacentHTML
- insertBefore
- isSameNode
- outerHTML
- onmouseout
- onmouseover
- querySelectorAll
- removeEventListener