案例_轮播图、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 @   漁夫  阅读(26)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示