案例2_轮播图与BOM_Window_属性

案例2_轮播图

     分析：
       1.在页面上使用img标签展示图片
       2.定义一个方法，修改图片对象的src属性
       3.定义个定时器，每3秒调用方法一次
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>轮播图</title>
</head>
<body>
    <img id="img" width="600px " height="300px" src="img/img01.png">

    <script>
        /*
        *     分析：
        *        1.在页面上使用img标签展示图片
        *        2.定义一个方法，修改图片对象的src属性
        *        3.定义个定时器，每3秒调用方法一次
        */

        //修改图片
         var number = 1;
         function  fun(){
             number++;
             //判断是否大于2
             if (number>2){
                 number = 1;
             }
             //获取img对象
             var img = document.getElementById("img");
             img.src ="img/img0"+number+".png";
         }
             //定义定时器
            setInterval(fun,3000);
    </script>
</body>
</html>

 

效果：过了3秒后切换图片

BOM_Window_属性

　　　

属性：

1.获取其他对象
   history
   location
   Navigator
   Screen
  2.获取DOM对象
   document

 /*  //获取history
        var h1 = window.history;
        var h2 = history;

        alert(h1);
        alert(h2);
*/
        var openBtn = window.document.getElementById("openBtn");
        alert(openBtn);

        document.getElementById("")

 

　　　　

posted @ 2022-11-21 15:39  zj勇敢飞，xx永相随  阅读(17)  评论(0)  编辑  收藏  举报