>>分享Web前端开发技术,并对孙卫琴的《精通Vue.js:Web前端开发技术详解》提供技术支持 书籍支持  卫琴直播  品书摘要  在线测试  资源下载  联系我们
发表一个新主题 开启一个新投票 回复文章 您是本文章第 25849 个阅读者 刷新本主题
 * 贴子主题:  JavaScript Window 浏览器对象模型 回复文章 点赞(0)  收藏  
作者:sunshine    发表时间:2019-08-13 12:15:41     消息  查看  搜索  好友  邮件  复制  引用

  

JavaScript  Window - 浏览器对象模型

     浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器"对话"。            

浏览器对象模型 (BOM)

     浏览器对象模型( Browser Object

     Model (BOM))尚无正式标准。

      由于现代浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性,因此常被认为是 BOM 的方法和属性。            

Window 对象

      所有浏览器都支持 window 对象。它表示浏览器窗口。

      所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

      全局变量是 window 对象的属性。

      全局函数是 window 对象的方法。

      甚至 HTML DOM 的 document 也是 window 对象的属性之一:

       window.document.getElementById("header");

                             与此相同:

                  document.getElementById("header");                            

Window 尺寸

       有三种方法能够确定浏览器窗口的尺寸。

      对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari:    
  • window.innerHeight - 浏览器窗口的内部高度(包括滚动条)
  • window.innerWidth - 浏览器窗口的内部宽度(包括滚动条)
             对于 Internet Explorer 8、7、6、5:            
  • document.documentElement.clientHeight
  • document.documentElement.clientWidth
             或者            
  • document.body.clientHeight
  • document.body.clientWidth
             实用的 JavaScript 方案(涵盖所有浏览器):              

范例

var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

     该例显示浏览器窗口的高度和宽度。            

其他 Window 方法

     一些其他方法:            
  • window.open() - 打开新窗口
  • window.close() - 关闭当前窗口
  • window.moveTo() - 移动当前窗口
  • window.resizeTo() - 调整当前窗口的尺寸
程序猿的技术大观园:www.javathinker.net



[这个贴子最后由 flybird 在 2020-02-24 11:45:19 重新编辑]
  Java面向对象编程-->集合(上)
  JavaWeb开发-->Web运作原理(Ⅲ)
  JSP与Hibernate开发-->通过JPA API检索数据
  Java网络编程-->用Swing组件展示HTML文档
  精通Spring-->绑定CSS样式
  Vue3开发-->通过Axios访问服务器
  10个 Web 开发人员的常用的 Chrome 扩展程序
  vue3.0-基本特性和用法
  Vue CLI项目的package.json中版本号详解~和^和*的区别
  深入理解Vue的响应式系统
  Vue CLI内网安装(禁止运行vue指令解决方案)
  Vue.js学习笔记-基础部分+完整实现代码
  JavaScript的HTML DOM td / th 对象
  HTML DOM Radio 单选按钮对象
  JavaScript Error(错误) 对象
  Javascript DOM封装方法汇总
  jQuery UI 范例:show()方法
  CSS 网页布局
  JavaScript 调试
  JavaScript 输出数据
  一文读懂前端技术演进:盘点Web前端20年的技术变迁史
  更多...
 IPIP: 已设置保密
楼主      
1页 0条记录 当前第1
发表一个新主题 开启一个新投票 回复文章


中文版权所有: JavaThinker技术网站 Copyright 2016-2026 沪ICP备16029593号-2
荟萃Java程序员智慧的结晶,分享交流Java前沿技术。  联系我们
如有技术文章涉及侵权,请与本站管理员联系。