JavaScript 23 Window

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>

猜你喜欢

转载自www.cnblogs.com/JasperZhao/p/13369966.html