码迷,mamicode.com
首页 > Web开发 > 详细

JS DOM操作兼容

时间:2017-09-26 19:34:31      阅读:231      评论:0      收藏:0      [点我收藏+]

标签:rtb   elements   selector   undefined   var   function   app   rom   dom   

 <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操作兼容

标签:rtb   elements   selector   undefined   var   function   app   rom   dom   

原文地址:http://www.cnblogs.com/xingkongly/p/7597854.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!