var box = document.getElementById("box"); var one = document.getElementById("one"); var list = document.getElementById("list"); console.log(box.nodeName); console.log(box.nodeType); console.log(box.childNodes[1].innerHTML); // 文本内容 // innerHTML 包含html标签 // innerText 不包含html标签 // childNodes[num] 子节点 // 节点值 // nodeValue // var other = document.getElementById("other"); // alert(other.innerHTML) var first = document.getElementById("first"); // 创建元素 createElement var a = document.createElement("span"); console.log(a); a.innerHTML = '新的元素'; console.log(a); // box.insertBefore(a,b); // 插入 // insertBefore(参数1,参数2); // 参数1 要插入的当前元素 // 参数2 项参数2中添加参数一的内容 first.insertBefore(a,first[0]) var ul = document.createElement("ul"); var li = document.createElement("li"); li.innerHTML = '列表1'; console.log(ul,'ul'); console.log(li,'li'); // 添加 appendChild ul.appendChild(li); console.log(ul,'添加'); box.appendChild(ul); // var news = document.createElement('b'); // news.innerHTML = '字体'; // box.insertBefore(news,box[0]); //删除 removeChild // box.removeChild(ul); var h5 = document.createElement("h5"); h5.innerHTML = '这是一个标题'; // 替换节点 replaceChild(新节点,旧节点); // box.replaceChild(h5,first); // 删除整个节点 remove() // box.remove() // console.log(list.childNodes[0]) var li1 = document.querySelectorAll("#list li")[0] console.log(li1) list.insertBefore(h5,list[4]);