window对象
BOM的核心是window对象,表示浏览器的实例。window对象在浏览器有两重身份👇1.ECMAScript中的Global对象。
2.浏览器窗口的JavaScript接口。
1.Global作用域
因为window对象被复用为ECMAScript的Global对象,所以通过var声明的所有全局变量和函数都会变成window对象的属性和方法。2.窗口关系
top对象始终指向最上层(最外层)窗口,即浏览器窗口本身。而parent对象始终指向当前窗口的父窗口。如果当前窗口是最上层窗口,则parent等于top(都等于window)。最上层的window,如果不是通过window.open()打开的,那么其name属性就不会包含值。3.窗口位置与像素比
window.moveTo(0,0)把窗口移动到左上角
window.moveBy(0,100)把窗口向下移动100像素
window.moveTo(200,300)把窗口移动到坐标位置(200,300);
window.moveBy(-50,0)把窗口向左移动50像素
像素比:想不想知道什么是像素比,那我给你举个🍟:16px的字体,在手机和电脑上的显示大小是否相同?那在4k屏和2k屏下显示大小是否相同?是不是更想知道了,那就去百度吧!
4.窗口大小
outerWidth和outerHeight返回浏览器窗口自身的大小。
innerWidth和innerHeight返回浏览器窗口中页面视口的大小。
resizeTo resizeBy
5.视口位置
window.scrollBy({ left:100, top:100, behavior:'auto/smooth' })
window.ScrollTo(x,y)
还可以通过Behavior属性控制是否平滑滚动。
6.导航与打开新窗口
window.open()可以接受四个参数:url、目标窗口、特性字符串和什么什么看不懂的东西。通常调用方法时只传前三个参数。
window.open('http://supersky.fun','topFrame')
第二个参数,如果有一个窗口名叫topFrame那就在该窗口打开,否则就会打开一个新窗口。第二个参数还可以传入特殊的窗口名,比如👇
_self _parent _top _blank
7.定时器
JavaScript在浏览器中是单线程执行的,但是允许定时器每隔一段时间就执行相应的代码。
setTimeout()用于指定在一定时间后来执行某些代码。
setInterval()用于指定每隔一段时间来执行某些代码。
setTimeout(()=>alert('Hello world!'),1000);
setTimeout()方法通常包含两个参数。第一个参数可以是包含JavaScript代码的字符串,或者一个函数。第二个参数是要等待的毫秒数。
调用setTimeout时,会返回一个表示超市排期的数值ID,调用clearTimeout()可以用于取消该任务。
let TimeoutID = setTimeout(()=>alert('Hello world!'),1000);
clearTimeout(TimeoutID);
setInterval()的方法和上面的差不多,调用时会返回一个循环定时ID,调用clearInterval()来终止。
8.系统对话框
一共有如下三种:
alert()
confirm()确认框,返回0,1
prompt()提示框,prompt接受两个参数,要显示给用户的文本,以及文本框的默认值(可以是空字符串)。prompt()会返回用户输入的值或者null。
文章内容参考:JavaScript高级程序设计(第四版)标题样式来自:juejin.cn/post/684490…
哪里写错了就联系我🐧:54269504