<style> ???????*{ ???????????margin:0; ???????????padding:0; ???????} ??????li{ ??????????list-style-type:none ??????}</style></head><body> ?????????<input type="button" value="点我"> ?????<div id="div"> ????????<ul> ????????????</ul> ?????</div> ?????<script> ?????????var input=document.querySelector(‘input‘); ?????????var ul=document.querySelector("ul"); ?????????//用querySelectorAll时,lis[0]一直是undefined【chrome/IE都一样】 ?????????var lis=document.getElementsByTagName("li"); ?????????var index=0; ?????????input.onclick=function(){ ?????????????var cLi=document.createElement(‘li‘); ????????????index++; ??????????????????????????cLi.innerHTML=input.value+index; ????????????if(lis[0]){//【为了兼容IE】 ?????????????ul.insertBefore(cLi,lis[0]); ????????????}else{ ????????????????ul.appendChild(cLi);//【为了兼容IE】 ????????????} ?????????} ?????????//为了兼容IE8必须把document.body.firstElementChild/lastElementChild/previousChild/nextChild放到前边 ?????????alert(document.body.firstElementChild.value ||document.body.firstChild.value ) ?????????</script></body></html>
JS DOM操作兼容
原文地址:http://www.cnblogs.com/xingkongly/p/7597854.html