9.3小笔记 DOM的增删改查

border-collapse: collapse 这个样式可以把表格的内部边框消除,变成一条细线
表格可以通过循环在script中直接表示:
document.write(“

”)
document.write(““);
for (var i = 1 ; i <=1 ; i++){
document.write(“”);
for(var j = 0 ; j <4 ; j++){
document.write(““);
}
}
document.write(“”);
for (var i = 0 ; i <10 ; i++){
document.write(“”);
for(var j = 0 ; j <4 ; j++){
// if (j = 3){
// str1[i][j] = “ ” str1[i][j] “
// }
document.write(““);
}
}
” +str[j] + “
” + str1[i][j] + “
可以去掉表格的外边框。

获取DOM元素的常用方法:
1通过id
var head = document.getElementById(“”);
2通过class
var rows = document.getElementsByClassName(“”)
3通过标签名
var tds = document.getElementsByTagName(“”)
4通过name
var tsd = document.getElementByName(“”)

childNodes 获取所有的子节点,会把空格和换行也当成节点
children获取所有的子节点

获取第一个子节点console.log(tbody.firstElementChild);
获取最后一个子节点console.log(tbody.lastElementChild);
获取父节点console.log(tbody.parentNode)
console.log(tbody.previousElementSibling);
创建一个tr节点
var tr= document.createElement(“tr”);
创建一个td节点
var td1 = document.createElement(“td”);
设置第一个节点里的内容
td1.innerHTML = “11”;
把td1放进tr里
tr.appendChild(td1);
把tr加入tbody
tbody.insertBefore(tr,t);
appendChild接受一个对象节点作为参数,将其作为最后一个节点,插入当前的节点
insertBefore用于将某个节点插入当前节点的位置,第一个参数是要插入的节点,第二个参数适当前节点的一个子节点,新的节点将插在这个节点的前面

removeChild删除这个节点
replaceChild用于将一个新的节点替换当前节点的一个子节点,第一个参数是要替换掉的新节点,第二个参数是要替换掉的节点

获取和设置属性,详见9.3倒数第二张图

猜你喜欢

转载自blog.csdn.net/nuoyuezuo/article/details/82353222
今日推荐