BOM即 浏览器对象模型(Browser Object Model)
浏览器对象包括
Window(窗口)
Navigator(浏览器)
Screen (客户端屏幕)
History(访问历史)
Location(浏览器地址)
本章节从 Window(窗口)开始讲起
示例 1 : 获取文档显示区域的高度和宽度
示例 2 : 获取外部窗体的宽度和高度
示例 3 : 打开一个新的窗口
示例 1 :
获取文档显示区域的高度和宽度
一旦页面加载,就会自动创建window对象,所以无需手动创建window对象。
通过window对象可以获取文档显示区域的高度和宽度
<script> document.write("文档内容"); document.write("文档显示区域的宽度"+window.innerWidth); document.write("<br>"); document.write("文档显示区域的高度"+window.innerHeight); </script>
示例 2 :
获取外部窗体的宽度和高度
所谓的外部窗体即浏览器,可能用的是360,火狐,IE, Chrome等等。
<script> document.write("浏览器的宽度:"+window.outerWidth); document.write("<br>"); document.write("浏览器的高度:"+window.outerHeight); </script>
示例 3 :
打开一个新的窗口
有的时候,你碰到一些网站会自动打开另一个网站,那么是怎么做到的呢?
就是通过window的open方法做到的
不建议使用,如果需要打开一个新的网站,应该通过超级链接等方式让用户主动打开,在没有告知用户的前提下就打开一个新的网站会影响用户的体验
<script> function openNewWindow(){ myWindow=window.open("/"); } </script> <button onclick="openNewWindow()">打开一个新的窗口</button>