美文网首页
js 数组及流程控制语句

js 数组及流程控制语句

作者: 心i_af0a | 来源:发表于2019-01-14 15:45 被阅读0次

    js数组

    join 能把元素连起来 连接字符串 合并元素
    push 添加 末尾
    pop 删除 末尾
    unshift 添加 开头
    shift 删除 开头
    reverse 反转 ’不是倒序!!!
    indexOf 相同元素 返回第一个元素的索引值 查找字符首次出现的索引

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组常用方法</title>
        <script type="text/javascript">
            var arr = [1,2,3,4];
            //ar str = arr.join('-'); 
            //join 能把元素连起来 连接字符串 合并元素
            //alert(str); //1-2-3-4
    
            //arr.push(5);  //push 添加 末尾
            //alert(arr); //1,2,3,4,5
    
            //arr.pop(); // pop 删除 末尾
            //alert(arr);  //1,2,3
    
            //arr.unshift(0);//unshift 添加 开头
            //alert(arr); //0,1,2,3,4
    
            // arr.shift();  // shift 删除 开头
            // alert(arr); // 2,3,4
    
            //arr.reverse();   
            //reverse 反转  ’不是倒序!!!‘
            //alert(arr); //4,3,2,1
    
            var arr2 = ['a','b','c','d','a','b','c','d'];
            // var num = arr2.indexOf('b'); 
            //indexOf 相同元素 返回第一个元素的索引值         查找字符首次出现的索引
            // alert(num); // 1
    
            // 参数1 :表示索引从2的元素开始 参数2:表示删除1个元素
            // arr2.splice(2,1);  
            // alert(arr2);  //a,b,d,a,b,c,d
    
            
            // 参数3:再插入字母e  //替换 包括插入删除  
            // arr2.splice(2,1,'e'); //a,b,e,d,a,b,c,d
            // alert(arr2)
    
    
            arr2.splice(4,4,'x','i','n','g');
            alert(arr2);
        </script>
    </head>
    <body>
        
    </body>
    </html>
    

    js流程控制语句为

    1 条件判断语句 : if else
    2 条件分支语句: switch...case
    3 循环语句 : for while do...while

    js 循环语句

    for循环 while循环

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>循环语句</title>
        <script type="text/javascript">
            window.onload = function(){
                var list01 = document.getElementById('list01')
                var lis = list01.getElementsByTagName('li')
                // for(var i=0; i<lis.length; i++){
                //  lis[i].style.background = 'pink';
                // }
                // for(var i=0; i<lis.length; i++){
                //  if(i%2 == 0){
                //      lis[i].style.background = 'pink';
                //  }
                // }
    
                // if(i%2 == 0) 隔行变色
                // var i=0;
                // while(i<lis.length){
                //  if(i%2 == 0){
                //      lis[i].style.background = 'pink';
                //  }
                //  i++;
                // }
    
                // var i = 100; 
                // do{   // do 先执行一次
                //  if(i%2 == 0){
                //      lis[i].style.background = 'pink';
                //  }
                //  i++;
                // }while(i<lis.length);
    
                for(;;){
                    //for 死循环
                    break
                }
    
                while(true){ // 死循环
                    break  //跳出循环
                }
            }
        </script>
    </head>
    <body>
        <ul id="list01">
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
            <li>不将就</li>
        </ul>
    </body>
    </html>
    

    js条件语句

    if else

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>条件判断语句</title>
        <style type="text/css">
            .box{
                width: 300px;
                height: 300px;
                background-color: gold;
            }
        </style>
        <script type="text/javascript">
            window.onload = function(){
                var btn = document.getElementById('btn')
                var box = document.getElementById('box')
                btn.onclick = function(){
                    if (box.style.display == 'none') {
                        box.style.display = 'block';
                    }else{
                        box.style.display = 'none';
                    }
                }
            }
        </script>
    </head>
    <body>
        <input type="button" value="切换" id='btn'>
        <div class="box" id='box' ></div>
    </body>
    </html>
    

    js条件分支语句

    switch...case
    switch(today){
                case 1:
                    alert('语文')
                    break;
                case 2:
                    alert('数学')
                    break;
                case 3:
                    alert('英语')
                    break;
                case 4:
                    alert('美术')
                    break;
                case 5:
                    alert('舞蹈')
                    break;
                default:
                    alert('不补习')
            }
    

    相关文章

      网友评论

          本文标题:js 数组及流程控制语句

          本文链接:https://www.haomeiwen.com/subject/jtqjdqtx.html