一、什么是BOM
BOM(Browser Object Document)即浏览器对象模型。
BOM提供了独立于内容 而与浏览器窗口进行交互的对象;
由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window;
BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性;
BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,BOM最初是Netscape浏览器标准的一部分。
二、学习BOM学什么
我们将学到与浏览器窗口交互的一些对象,例如可以移动、调整浏览器大小的window对象,可以用于导航的location对象与history对象,可以获取浏览器、操作系统与用户屏幕信息的navigator与screen对象,可以使用document作为访问HTML文档的入口,管理框架的frames对象等。在这里,只介绍一些window对象等的基础知识,其中会有一些ECMAscript的知识还会说明。其他对象Location、Screen、Navigator、History不一一详细介绍了。。
三、window对象
window对象是js中的顶级对象,所有定义在全局作用域中的变量、函数都会变成window对象的属性和方法,在调用的时候可以省略window。
例:
打开窗口 window.open(url,target,param);// url 要打开的地址//target 新窗口的位置 _blank _self _parent(父框架)//param 新窗口的一些设置//返回值,新窗口的句柄关闭窗口:window.close();
四、BOM零碎知识(window对象)
1.定时器
延迟执行 setTimeout( [string | function] code, interval);
clearTimeout([number] intervalId);
<body> <input type="button" value="closeTimerId" id="btn"> <script> var btn = document.getElementById("btn"); var timerId = setTimeout(function () { alert("23333"); }, 3000); btn.onclick = function () { //在设置的时间之前(3s内)点击可以取消定时器 clearTimeout(timerId); } </script> </body>
定时执行 var timerId = setInterval(code, interval);
clearInterval(timerId); //清除定时器
倒计时案例:
<body><input type="button" value="倒计时开始10" id="btn" disabled/><script> var btn = document.getElementById("btn"); var num = 10; var timerId = setInterval(function () { num--; btn.value = "到时器开始" + num; if (num == 0) { clearInterval(timerId); btn.disabled = false; btn.value = "同意,可以点了"; } },1000); </script> </body>
新闻热点
疑难解答
图片精选