案例_轮播图、BOM_Window属性

案例_轮播图

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>轮播图</title>



</head>
<body>

<!-- 图片-->
<img id = "img" src = "img/banner_1.jpg" width = "100%">

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


   */


  //修改图片src属性
  var number = 1;

  //定义方法
  function fun () {

    //number+1
    number ++ ;

    //判断number是否大于3
    if(number > 3) {

      //number大于3的话，就等于1
      number = 1;
    }
    //获取img对象
    var img = document.getElementById("img");

    //获取banner_的所有图片
    img.src = "img/banner_" + number + ".jpg";
  }

  //2.定义定时器
  setInterval(fun,3000);

</script>
</body>
</html>

 

 

BOM_Window属性

Window：窗口对象

　　1. 创建

　　2. 方法

　　　　1. 与弹出框有关的方法：

　　　　　　alert() 显示带有一段消息和一个确认按钮的警告框。

　　　　　　confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。

　　　　　　如果用户点击确定按钮，则方法返回true

　　　　　　如果用户点击取消按钮，则方法返回false

　　　　　　prompt() 显示可提示用户输入的对话框。

　　　　　　返回值：获取用户输入的值

　　　　2. 与打开关闭有关的方法：

　　　　　　close() 关闭浏览器窗口。

　　　　　　谁调用我 ，我关谁

　　　　　　open() 打开一个新的浏览器窗口

　　　　　　返回新的Window对象

　　　　3. 与定时器有关的方式

　　　　　　setTimeout() 在指定的毫秒数后调用函数或计算表达式。

参数：

　　1. js代码或者方法对象

　　2. 毫秒值

　　　　返回值：唯一标识，用于取消定时器

　　　　　　clearTimeout() 取消由 setTimeout() 方法设置的 timeout。

　　　　　　setInterval() 按照指定的周期（以毫秒计）来调用函数或计算表达式。

　　　　　　clearInterval() 取消由 setInterval() 设置的 timeout。

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

    //获取history
    var h2 = history;

    //页面弹窗
    alert(h1);

    //页面弹窗
    alert(h2);


    //完整的路径，’window.‘  可以省略
    var openBtn = window.document.getElementById("openBtn");

    //页面弹窗
    alert(openBtn);

 

posted @ 2022-10-26 10:51  漁夫  阅读(35)  评论(0)    收藏  举报