首页 > 其他分享 >案例_轮播图、BOM_Window属性

案例_轮播图、BOM_Window属性

时间:2022-10-26 11:01:19浏览次数:96  
标签:轮播 img number Window BOM 按钮 var

案例_轮播图

<!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);

 

标签:轮播,img,number,Window,BOM,按钮,var
From: https://www.cnblogs.com/yuzong/p/16827516.html

相关文章

  • Windows11 22H2版跳过联网安装方法
    1、虚拟机或真机在安装系统前断开连网。2、到连网界面时,输入Win+E打开资源管理器邮件我的电脑--》管理--》账户 启用administrator账户;3、按住Shift+F10打开CMD......
  • windows 如何使用docker
     windows导入子系统https://docs.microsoft.com/zh-cn/windows/wsl/install-win10windoes安装WSL1与更新到WSL2  以管理员身份打开PowerShell并运行:dis......
  • Windows 2016 安装 Jenkins
    https://www.jenkins.io/download/安装thisaccounteitherdoesnothavetheprivilegetologon解决:控制面板\所有控制面板项\管理工具配置输入http:/......
  • 显示windows电脑当前的内存,CPU占用的软件----TrafficMonitor
    github地址:https://github.com/zhongyang219/TrafficMonitor效果:......
  • windows搭建php环境
    本次介绍的是phpstudy(主要是方便)教程:1.先到官网下载phpstudyWindows版2.下载好后解压出来3.解压好了后,鼠标右击phpStudy_64.8.1.1.3选择已管理员身份运行4.进去后,......
  • Installing VMware Workstation Pro on Windows
    一、InstallingVMwareWorkstationProonWindows地址https://www.vmware.com/get-started.html   VMwareWorkstationPro最新激活密钥许可证大全VM16激......
  • windows和虚拟机上的Ubuntu互传文件
    1.简介本文讲述的是通过ssh登录虚拟机上的Ubuntu系统,实现互传文件2.Ubuntu端2.1.安装sshsudoapt-getupdatesudoapt-getinstallopenssh-server2.2.启动sshs......
  • QWidget,QMainWindow和QDialog的区别
    在创建QtGuiApplication时,总会让你选择在QWidget,QMainWindow和QDialog中选择一个BaseClass。这三个类具体有什么区别呢?在Qt的手册和网上找了一些资料。先看官方的手......
  • day11DOM和BOM回顾以及事件讲解 ( 上 )
    内容回顾BOM(bowserobjectmodel)浏览器对象模型window:窗口对象(全局的变量及函数都属于window也就是global全局对象)location:地址栏对象(获取地......
  • 解决Windows 10无法安装.msi文件的办法
    问题描述:打开.msi文件提示打开方式,无法安装。 解决方法:1.Windows+R键打开运行,输入services.msc回车,找到WindowsInstallers服务器,开启此服务。  2.以管理员身份......