先端基本功--Js実戦5 11.05

5013 ワード

一、1.ノード属性getAttribute(属性)取得属性alert(demo.getAttribute("title")); 2.ノード属性SetAttribute(「プロパティ」、「値」)を設定し、属性をどの値div.setAttribute(“class”,”demo”); 3に変更しますか?ある属性removeAttribute(「プロパティ」)を削除します.demo.removeAttribute(“title”) A.apped Child(B);BさんはA子に違いないです.bさんはaの中に入れて、一番後ろに入れました.bはaに入れるA.insertBefore(B,C)B Cは全部Aの子供です.bをaに入れますが、cの前です.二、動的に小さな円を生成する
window.onload = function () {
       var scroll = document.getElementById('scroll');
       var yuan = document.createElement("div");
       scroll.appendChild(yuan);// scroll     yuan
       yuan.setAttribute("class","yuan");   //    
       var ul = document.getElementById('ul');
       var lis = ul.children;    //ul     
       for (var i = 0 ; i < lis.length ; i++) {
          var newspan = document.createElement("span"); //  span  
          newspan.innerHTML = i+1;  //      
          yuan.appendChild(newspan);  // yuan      
       }
   }
三、
マイクロブログの小さなインスタンスを発行し、ノードの削除を追加することにより、ノードの削除を追加する動作の考え方を鍛える.
   
        window.onload = function () {
            var btn = document.getElementsByTagName('button')[0];
            var txt = document.getElementsByTagName('textarea')[0];
            var ul = document.createElement("ul");
            btn.parentNode.appendChild(ul);
            btn.onclick = function(){
                if (txt.value == "") {
                alert("      !");
                return false;
            }
            var newli = document.createElement("li"); //            for  
            newli.innerHTML = txt.value + "<a href = 'javascript:;'>  </a>";
            ul.appendChild(newli);
            txt.value = "" ;

            //            
            var lis = ul.children;
            if (lis.length == 0){
                ul.appendChild(newli);
            }//        ,     ul 
            else {
                ul.insertBefore(newli,lis[0]);
            }//         lis    

            //      
            var as = document.getElementsByTagName("a");//     a  
            for (i = 0 ; i < as.length; i++){
                as[i].onclick = function(){
                    ul.removeChild(this.parentNode);
                    //  a    li     ,         , ul   a     li
                }
            }
        }
</code></pre> 
 <p><strong> 、    :                   ,      ,                       。</strong><br> <strong> 、    </strong><br> 1.Date()         ,      。<br> <code>var date = new Date();</code> //   <br> console.log(date.getTime()); //      <br> console.log(date.valueOf());<br> console.log(Date.now());//     <br> console.log(+new Date());<br>      。<br> 2.  <br> getDate()     1-31<br> getDay ()      0-6<br> getMonth ()     0-11<br> getFullYear ()       (      )<br> getHours ()      0-23<br> getMinutes ()      0-59<br> getSeconds ()     0-59<br> getMilliseconds ()        <br> getTime ()        ( 1970/1/1  )</p> 
 <ol start="3"> 
  <li>       </li> 
 </ol> 
 <pre><code><script type="text/javascript">
       window.onload = function () {
           var box = document.getElementById('box');
           var child = box.children;
           var date = new Date();//      
           var arr = ["   " ,"   " ,"   " ,"   " ,"   " ,"   " ,"   " ,]
            child[0].innerHTML = date.getFullYear()+" "+(date.getMonth()+1)+" "+date.getDate()+" "+" " + arr[date.getDay()];//       ,       。
            child[1].innerHTML = date.getDate();
        }
   
  • window.setInterval(“ ”, ) set Interval(fun,1000)1000ミリ秒ごとに1秒ごとにFnという関数を実行します.set Interval(fun(1000)はset Interval(function){},1000)setInterval(fun(1000)のエラーの5.カウントダウンは将来の時間で現在の時間を減算します.将来のミリ秒数-現在のミリ秒数を連続的に変換すればいいです.
     
            window.onload = function(){
                var demo = document.getElementById('demo');
                var endTime = new Date("2017/11/11 00:00");//     
                setInterval(clock,1000);
                function clock(){
                    var nowTime = new Date(); //    ,           
                    var second= parseInt((endTime.getTime()  - nowTime.getTime())/1000);
                      //      
                    var d = parseInt(second/3600/24); //  
                    var h = parseInt(second/3600%24);
                    var m = parseInt(second/60%60);
                    var s = parseInt(second%60);
                    d<10 ? d="0"+d : d;
                    h<10 ? h="0"+h : h;
                    m<10 ? m="0"+m : m;
                    s<10 ? s="0"+s : s; //  !!
                    demo.innerHTML = "       :"+d+" "+h+"  "+m+"  "+s+" ";
                }
            }
        
    
    まとめ:まず終了時間を定義して、タイマーを呼び出して、タイミング関数で現在の時間を取得し、残りの時間を計算して、そのあとの時間を計算します.