操作DOM
<body>
<span>开始</span>
<div id="box" title="标题" class="bbb">
<p>测试Div1</p>
<p>测试Div2</p>
<p>测试Div3</p>
</div>
</body>
<script>
document.write("<h1>你好</h1>");
document.write("<h1>你坏</h1>");
document.write("<h1>你好坏</h1>");
//获得div id为box的标签
var box1=document.getElementById("box");
console.log(box);
//向页面中添加新节点 分两步
//1.在内存中创建DOM结点 createElement
var p1=document.createElement("p");
//2.将内存中的DOM结点添加到页面中 appendChild
//box.appendChild(p);
//在内存中创建文本结点 createTextNode
var p1text=document.createTextNode("测试Div4");
p1.appendChild(p1text);
box.appendChild(p1);
var p2=document.createElement("p");
var p2text=document.createTextNode("测试Div5");
p2.appendChild(p2text);
box1.insertBefore(p2,box1.firstChild);//insertBefore()函数要用父节点去调用,p2插入到box1.firstChild前面
</script>
代码结果: