欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

DOM和BOM-day24-个人学习笔记

程序员文章站 2022-07-14 18:33:13
...

DOM和BOM-day24-个人学习笔记


一、BOM专门操作浏览器窗口的对象

1、window对象

角色:a、充当全局对象!b、包含BOM常用对象

属性:

(1)窗口大小和定位

innerHeight/Width:文档显示区的大小
outerHeight/Width:窗口大小
pageYOffest:文档左上角到文档显示区左上角的距离

(2)分辨率

screen.height/width:桌面完整分辨率宽高
screen.availHeight/availWidth:去掉任务栏后剩余分辨率的宽高
(3)调整大小
window.resizeTo(width,height)调整到
window.resizeBy(变化的width,变化的height)

(4)位置

左上角X坐标:window.screenLeft||window.screenX
左上角Y坐标:window.screenTop||window.screenY;
将窗口移动到指定坐标:window.moveTo(x,y)
事件发生时,鼠标相对于整个屏幕的坐标:event.screenX|screenY

(5)打开新链接:4种效果

a、在当前窗口打开新链接,可后退

html:<a href="url" target="_self"></a>
js:[window.]open("url","_self")

b、在当前窗口打开新链接,禁止后退

js:location.replace("新url")

c、在新窗口打开新链接,可同时打开多个

html:<a href="url" target="_blank"></a> 
js:[window.]open("url","_blank")

d、在新窗口打开新链接,只能打开一个

html:<a href="url" target="自定义窗口名"></a>
js:[window.]open("url","自定义窗口名")

2、定时器:让浏览器按指定时间间隔反复执行同一任务

周期性定时器:让浏览器按指定时间间隔反复执行同一任务,如果不手动停止,则一直反复执行

一次性定时器:让浏览器等到一段时间间隔,执行一次任务自动停止。

建议:尽量使用一次性定时器,代替周期性定时器

如何使用:周期性和一次性用法完全相同的

(1)周期性定时器:3件事

a、动画的每一步要执行的任务(函数对象)

function step(){每一步要做的事情}

b、将一步的任务放入定时器,反复调用

timer=setInterval(step,间隔毫秒数)

c、必须用全局变量,临时存储定时器的编号

clearInterval(timer);
timer=null;

(2)一次性定时器:3件事
a、动画的每一步要执行的任务(函数对象)

function step(){每一步要做的事情//根据条件判断是否有必要继续注册}

b、将一步的任务放入定时器,反复调用

timer=setTimeout(step,间隔毫秒数)

c、必须用全局变量,临时存储定时器的编号

clearTimeout(timer);
timer=null;