前端5 --- windows 对象

最新推荐文章于 2024-08-08 08:14:27 发布

今天备忘录了吗

最新推荐文章于 2024-08-08 08:14:27 发布

阅读量791

点赞数

分类专栏：前端文章标签： windows service javascript

本文链接：https://blog.csdn.net/Lachesis_/article/details/112779691

版权

本文介绍了JavaScript中的BOM（浏览器对象模型）重点——Window对象，包括窗口操作、对话框、定时器、Location和Navigator子对象。Window对象作为浏览器窗口的代表，拥有众多属性和方法，如location.href用于获取或设置页面URL，navigator对象则用于获取浏览器信息。通过实例展示了如何使用window.open()打开新窗口、alert()、confirm()、prompt()对话框以及setTimeout()和setInterval()实现定时任务。

摘要由CSDN通过智能技术生成

子对象	说明
document	文档对象，用于操作页面元素
location	地址对象，用于操作URL地址
navigator	浏览器对象，用于获取浏览器版本信息
history	历史对象，用于操作浏览历史
screen	屏幕对象，用于操作屏幕宽度高度

你没看错，document对象也是window对象下的一个子对象。很多人以为一个窗口就是一个document对象，其实这个理解是错的。因为一个窗口不仅仅包括HTML文档，还包括浏览器信息、浏览历史、浏览地址等等。而document对象仅仅专门用来操作我们HTML文档中的元素。一句话概括就是：“一个窗口就是一个window对象，这个窗口里面的HTML文档就是一个document对象，document对象是window对象的子对象。”

window对象及下面这些location、navigator等子对象，由于都是操作浏览器窗口的，所以我们又称之为“BOM”，也就是Browser Object Module（浏览器对象模型）。BOM这个术语很常见，我们至少要知道它是什么意思。BOM和DOM都是“某某对象模型”，所谓的对象模型，可以简单理解为把它们看成一个对象来处理。

此外，你也可以把window下的子对象看成是它的属性，只不过这个属性也是一个对象，所以我们才称之为“子对象”。对象一般都有属性和方法，上表介绍的是window对象的属性。实际上，window对象也有非常多的方法，常用的如下表所示。

window对象常用方法

方法	说明
alert()	提示对话框
confirm()	判断对话框
prompt()	输入对话框
open()	打开窗口
close()	关闭窗口
setTimeout()	开启“一次性”定时器
clearTimeout()	关闭“一次性”定时器
setInterval()	开启“重复性”定时器
clearInterval()	关闭“重复性”定时器

对于window对象来说，无论是它的属性，还是方法，都可以省略window前缀。例如window.alert()可以简写为alert()，window.open()可以简写为open()，甚至window.document.getElementById()可以简写为document.getElementById()，以此类推。

window对象的属性和方法是非常多的，但是大多数都用不上。在这一章中，我们只针对最实用的来讲解，掌握好这些已经完全够了，其他的属性和方法，可以直接忽略掉。

窗口操作

1.打开窗口

在JavaScript中，窗口常见的操作有两种：一种是“打开窗口”；另外一种是“关闭窗口”。打开窗口和关闭窗口

语法

window.open(url, target)

说明
其中url为打开的链接url ，target为打开方式，常见为_self 和 _blank
_blank表示在新窗口打开；为_self时，表示在当前窗口打开。

举例: 打开一个新窗口输出一个页面

window.onload = function () 
{
   
    var oBtn = document.getElementById("btn");
    var opener = null;
    oBtn.onclick = function () 
    {
   
        opener = window.open();
        var strHtml = '<!DOCTYPE html>\
                    <html>\
                    <head>\
                        <title></title>\
                    </head>\
                    <body>\
                        <strong>小心偷影子的人，他会带走你的心。</strong>\
                    </body>\
                    </html>';        
        opener.document.write(strHtml);
    };
}