DOM操作：insertAdjacentHTML与Range的实现
利用insertAdjacentHTML与Range实现DOM操作，可以允许我们把一串字符串快速的转变为DOM元素，并插入到文档中的具体位置。
function fn(){//IE 和 Chromevar str = '<div style="width:200px;height:100px;background-color:gray;">Content here</div>';var b = document.getElementById("b");//b.insertAdjacentHTML('BeforeBegin',str);//把str元素插入在b之前//b.insertAdjacentHTML('AfterBegin',str);//把str元素插入作为b的第一个子元素//b.insertAdjacentHTML('BeforeEnd',str);//把str元素插入作为b的最后一个子元素b.insertAdjacentHTML('AfterEnd',str);//把str元素插入在b之后}function fn2(){//Firefoxvar str = '<div style="width:200px;height:100px;background-color:gray;">Content here</div>';var b = document.getElementById("b");var range = document.createRange();frag = range.createContextualFragment(str);//BeforeBegin //range.setStartBefore(b); //b.parentNode.insertBefore(frag, b);//afterbegin//range.setStartBefore(b.firstChild); // b.insertBefore(frag, b.firstChild); //beforeend range.setStartAfter(b.lastChild); b.appendChild(frag); //AfterEnd//range.setStartAfter(b);//b.parentNode.insertBefore(frag, b.nextSibling);}