【Webフロントエンド】慕授業網—JavaScript進級編10-1プログラミングチャレンジ

前言
ネット上の資料によって、憧れの授業ネットJavaScript進級編10-1プログラミング挑戦教程を実現しました.現在、IEブラウザにはいくつかのものをロードする必要があると発見しました.次はコードです.各行にコメントが付いていますので、分かりやすいです.

    
    
    
    

    // JS       
    window.onload = function(){
      //  id li   
      var liLi = document.getElementsByTagName("li"); 
      //   id  page div         
      var divPage = document.getElementById("page");   
      //  page div     div     
      var pageDiv = page.getElementsByTagName("div");  
      //     liLi              
      for(var i = 0; i < liLi.length; i++) { 
        //    i li  ，                  
        liLi[i].index = i;  
        //  i                  
        liLi[i].onclick = function() { 
          //     liLi                 
          for(var i = 0; i < liLi.length; i++) {   
            //      li                      
            liLi[i].className = "";                
          }    
          //       li        "li"，                  
          this.className = "li";      
          //     page    div  
          for(var j = 0; j < pageDiv.length; j++) {  
            //     div       ，                                    
            pageDiv[j].className = "hideContent";                
          }
          //   this           ，  pageDiv，      ，               。
          pageDiv[this.index].className = "showContent";            
        }                
      } 
    }


    





    

        

      
         
    
    

      
        
    
    
 
      
         
    
    


  

    
275           20    

       200        140      

                 53   5 50 

            5000           
  
  

    
  40                

                  90       

                  66       

                          
  
  

    
    3 260      2 250w 

        3   2 290  130 2     

               260  121 70  !

           280     2    248