insertAdjacentElement》在dom中插入的位置

var div = document.getElementById("d");
    var bt = document.getElementById("bt");
    bt.onclick = function (e) {
        //div.insertAdjacentElement("beforeBegin", document.createElement("p")); //div之前
        //div.insertAdjacentElement("afterBegin", document.createElement("p")); //div所有子元素之前
        //div.insertAdjacentElement("beforeEnd", document.createElement("p")); //div所有子元素之后
        //div.insertAdjacentElement("afterEnd", document.createElement("p")); //div之后
        //div.insertAdjacentHTML("beforeBegin", "<p>3</p><p>4</p>"); 
        //div.insertAdjacentHTML("afterBegin", "<p>3</p><p>4</p>"); 
        //div.insertAdjacentHTML("beforeEnd", "<p>3</p><p>4</p>"); 
        //div.insertAdjacentHTML("afterEnd", "<p>3</p><p>4</p>"); 
        //div.insertAdjacentText("beforeBegin", "the sky is mine"); 
        //div.insertAdjacentText("afterBegin", "the sky is mine"); 
        //div.insertAdjacentText("beforeEnd", "the sky is mine"); 
        //div.insertAdjacentText("afterEnd", "the sky is mine"); 
        //div.innerHTML = "<p>3</p><p>4</p>";
        //div.innerText = "<p>3</p><p>4</p>";//注意这两个效果不一样 这就是 text 和 html 的区别
        //div.appendChild(document.createElement("p")); //这个就等于上面第三个
        //div.insertBefore(document.createElement("p"),document.getElementsByTagName("p")[1]);//没什么卵用
    };