11.28運(yùn)算符使用

隔行變色

%的用法

1.將顏色定義為數(shù)組;
2.用for循環(huán)獲??;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    ul{
        list-style: none;
        padding:0;
    }
    li{
        height:30px;width:800px;
    }
    </style>
</head>
<body>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <script>
        var oLi=document.getElementsByTagName('li');
        var arr=['red','#777','#f9f9f9','#ccc','#dda']
        for(var i=0;i<oLi.length;i++){
            oLi[i].style.background=arr[i%5];
        }
    </script>
</body>
</html>

鼠標(biāo)移入移出事件,js代碼:

<script>
      var oLi=document.getElementsByTagName('li');
      var arr=['red','#777','#f9f9f9','#ccc','#dda']
      // var color='';
      for(var i=0;i<oLi.length;i++){
          oLi[i].style.background=arr[i%5];
          oLi[i].index=i;
          oLi[i].onmouseover=function(){
              // color=this.style.background;
              this.style.background='grey';
          }
          oLi[i].onmouseout=function(){
              // this.style.background=color;
              this.style.background=arr[this.index%5];
          }
      }
  </script>

轉(zhuǎn)換秒

js代碼:

<script>
        var num=121312312312;
        alert('數(shù)字'+num+'是:'+parseInt(num/3600)+' h '+parseInt((num%3600)/60)+' m '+num%60+' s');
    </script>

運(yùn)算符類型

賦值:=,+=,-=,*=,/=,
關(guān)系:>,<,>=,<=,==,===;!=;
邏輯:&&/與;||/或;!/非
真假:除了:null,0,NaN,' ',undefined;其他為真,

用函數(shù)彈出數(shù)組

js代碼:

<script>
    function $(a,b){
        var arr=[];
        if(a>b){
            for(var i=b;i<=a;i++){
                arr.push(i);
            }
            
        }else{
            for(var i=a;i<=b;i++){
                arr.push(i);
            }               
        }
        return arr;
    }
    alert($(10,6));//arr=[10,9,8,7,6]
    alert($(0,4));//arr=[0,1,2,3,4]
</script>

選擇

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <table>
        <tr>
        <td><input type="checkbox"></td>
        <td>xxx</td>
        <td>xxxx</td>
        </tr>
        <tr>
        <td><input type="checkbox"></td>
        <td>xxx</td>
        <td>xxxx</td>
        </tr>
        <tr>
        <td><input type="checkbox"></td>
        <td>xxx</td>
        <td>xxxx</td>
        </tr>
    </table>
    <div>
        <input type="checkbox" id="select">全選
    </div>
    <script>
        var oSelect=document.getElementById('select');
        var oTable=document.getElementsByTagName('table')[0];
        var oInput=oTable.getElementsByTagName('input');


        oSelect.onclick=function(){
            if(!this.checked){
                for(var i=0;i<oInput.length;i++){
                    oInput[i].checked=false;
                }               
            }else{
                for(var i=0;i<oInput.length;i++){
                    oInput[i].checked=true;
                }               
            }                       
        }
        //方式1:
        for(var i=0;i<oInput.length;i++){
            oInput[i].onclick=function(){
                for(var i=0;i<oInput.length;i++){
                    if(oInput[i].checked){
                        oSelect.checked=true;
                    }else{
                        oSelect.checked=false;
                        break;
                    }
                }                                   
            }
        }
    //方式2:
    // for(var i=0;i<aInput.length;i++){

    //  aInput[i].onclick = function(){
    //      var isSelectAll = true;     
    //      for(var i=0;i<aInput.length;i++){
    //          if(!aInput[i].checked){
    //              isSelectAll = false;
    //              break;
    //          }
    //      }
    //      if(isSelectAll){
    //          oSelectAll.checked = true;
    //      }
    //      else{
    //          oSelectAll.checked = false;
    //      }
    //  }
    // }    
    </script>
</body>
</html>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • FreeCodeCamp - Basic JavaScript 寫在前面: 我曾經(jīng)在進(jìn)谷前刷過這一套題,不過當(dāng)時(shí)只...
    付林恒閱讀 16,577評論 5 28
  • 轉(zhuǎn)載請聲明出處 博客原文 隨手翻閱以前的學(xué)習(xí)筆記,順便整理一下放在這里,方便自己復(fù)習(xí),也希望你有也有幫助吧 第一課...
    前端進(jìn)階之旅閱讀 12,958評論 13 94
  • Comment your JavaScript Code JavaScript中的注釋方式有以下兩種: 使用 //...
    歸云丶閱讀 1,200評論 0 0
  • 標(biāo)簽: 我的筆記 ---學(xué)習(xí)資料:http://javascript.ruanyifeng.com/ 1. 導(dǎo)論 ...
    暗夜的怒吼閱讀 940評論 0 1
  • 城西那邊,覆蓋著一片密林,林子圍著墓地群,這是個(gè)皇家陵園,陵園里有一個(gè)守陵人,他叫阿吉。 阿吉是個(gè)老實(shí)人,憨厚勤奮...
    閑情閑趣閱讀 472評論 0 1

友情鏈接更多精彩內(nèi)容