webAPI 第五天 --- 延时器,定时器,offset系列

编程语言 同时被 3 个专栏收录
31 篇文章 0 订阅
45 篇文章 0 订阅
20 篇文章 0 订阅

这节知识中最重要的是我们的延时器和定时器,但是还有我们的一些细小的知识点需要了解

 

BOM : 浏览器对象模型,提供了一套操作浏览器的工具

  BOM包含的内容很多,但是东西都不太常用,定时器是最重要的

一.window对象

window是个全局对象   顶端对象  全局变量或者函数都是window的属性     window一般都会省略

1.window.onload

窗体加载完成会执行

窗体加载  --- html  图片  文件等这些资源加载

以后想要获取图片的宽高  => 在onload里面获取

2.open和close

open : 新开一个窗口  --window.open()

    1. 窗口的ur地址i

    2. 窗口名称或者target属性 _blank

    3.窗口的属性

     返回值 : 新窗口的名称

var newWin = window.open("http://www.baidu.com","_blank", "width=300,height=300");

close 关闭窗口

    1. window.close( ) 关闭当前窗口

    2. newWin.close( )  关闭新开的窗口

二.延时器和定时器

1.延时器setTimeOut()

    1.  结构: setTimeOut(参数1,参数2) , 

             参数1 :回调函数,延迟一段时间后要执行的函数

             参数2 : 间隔的事件    毫秒单位

    2.  作用 : 延迟一段时间执行代码

    3.  返回值 :timerId 

            作用:清除延时器     clearTimeOut()                        

2.定时器

    1.  结构: setInterval(参数1,参数2) , 

             参数1 :回调函数,间隔一段时间后要执行的函数

             参数2 : 间隔的事件    毫秒单位

    2.  作用 : 间隔一段时间执行代码

    3.  返回值 :timerId 

            作用:清除延时器     clearterval()     

三.其他对象

1.location对象 --- 控制浏览器的地址栏

location.href = 地址栏的ur地址   改变URL地址

location.reload() 加载刷新

2.history -- 历史网页

history.back( ) 后退

history.forward( ) 前进

histroy.go( ) :  go(1) 前进    go(0) 后退

四.screen系列

width            宽度
height           高度
availWidth    有效宽度
availHeight   有效高度

五.offset系列

offsetWidth     获取元素真实的宽度
offsetHeight    获取元素真实的高度
offsetParent    最近的定位元素(父元素)
offsetLeft         获取 自身左侧到offsetparent左侧的距离
offsetTop         获取 自身顶部到offsetParent顶部的距离
总结
    1. offset系列获取的数值类型,, 计算方便
    2. 大总结
        获取宽度/位置    offset系列    数值类型
        设置宽度/位置    tyle系列        字符串类型

 切记: 别忘了定位

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值