详解JavaScript编程中的window与window.screen对象


Posted in Python onOctober 26, 2015

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 Screen
window.screen对象在编写时可以不使用 window 这个前缀。
一些属性:

  • screen.availWidth - 可用的屏幕宽度
  • screen.availHeight - 可用的屏幕高度
  • Window Screen 可用宽度
  • screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如窗口任务栏。

实例

返回您的屏幕的可用宽度:

<script>

document.write("Available Width: " + screen.availWidth);

</script>

以上代码输出为:

Available Width: 1440

Window Screen 可用高度
screen.availHeight 属性返回访问者屏幕的高度,以像素计,减去界面特性,比如窗口任务栏。
实例
返回您的屏幕的可用高度:

<script>

document.write("Available Height: " + screen.availHeight);

</script>

以上代码将输出:

Available Height: 860
Python 相关文章推荐
Python中的自定义函数学习笔记
Sep 23 Python
详解Python中__str__和__repr__方法的区别
Apr 17 Python
Python可变参数*args和**kwargs用法实例小结
Apr 27 Python
python实现图片文件批量重命名
Mar 23 Python
python特性语法之遍历、公共方法、引用
Aug 08 Python
对python遍历文件夹中的所有jpg文件的实例详解
Dec 08 Python
Python列表操作方法详解
Feb 09 Python
在python3中实现更新界面
Feb 21 Python
Python任务调度利器之APScheduler详解
Apr 02 Python
使用jupyter notebook运行python和R的步骤
Aug 13 Python
Python中threading库实现线程锁与释放锁
May 17 Python
Python 如何实现文件自动去重
Jun 02 Python
深入讲解Python中的迭代器和生成器
Oct 26 #Python
Windows下使Python2.x版本的解释器与3.x共存的方法
Oct 25 #Python
解析Python编程中的包结构
Oct 25 #Python
Python实现获取域名所用服务器的真实IP
Oct 25 #Python
Python制作爬虫采集小说
Oct 25 #Python
Python验证企业工商注册码
Oct 25 #Python
日常整理python执行系统命令的常见方法(全)
Oct 22 #Python
You might like
PHP 检查扩展库或函数是否可用的代码
2010/04/06 PHP
PHP中的函数嵌套层数限制分析
2011/06/13 PHP
PHP使用range协议实现输出文件断点续传代码实例
2014/07/04 PHP
PHP实现文件下载详解
2014/11/27 PHP
yii,CI,yaf框架+smarty模板使用方法
2015/12/29 PHP
Laravel框架实现的批量删除功能示例
2019/01/16 PHP
PHP检查文件是否存在,不存在自动创建及读取文件内容操作示例
2020/01/23 PHP
tp5.1 框架数据库常见操作详解【添加、删除、更新、查询】
2020/05/26 PHP
jQuery学习2 选择器的使用说明
2010/02/07 Javascript
jQuery点击后一组图片左右滑动的实现代码
2012/08/16 Javascript
jQuery超简单选项卡完整实例
2015/09/26 Javascript
js全选按钮的实现方法
2015/11/17 Javascript
深入理解JavaScript中的块级作用域、私有变量与模块模式
2016/10/31 Javascript
实例分析js事件循环机制
2017/12/13 Javascript
使用D3.js创建物流地图的示例代码
2018/01/27 Javascript
es6函数之尾调用优化实例分析
2020/04/25 Javascript
用Python的pandas框架操作Excel文件中的数据教程
2015/03/31 Python
详解Python中的相对导入和绝对导入
2017/01/06 Python
Python实现将一个大文件按段落分隔为多个小文件的简单操作方法
2017/04/17 Python
python3.4下django集成使用xadmin后台的方法
2017/08/15 Python
Python正则捕获操作示例
2017/08/19 Python
使用pygame模块编写贪吃蛇的实例讲解
2018/02/05 Python
python爬虫基本知识
2018/03/05 Python
在python中利用最小二乘拟合二次抛物线函数的方法
2018/12/29 Python
python按照多个条件排序的方法
2019/02/08 Python
pytorch查看torch.Tensor和model是否在CUDA上的实例
2020/01/03 Python
Pytorch提取模型特征向量保存至csv的例子
2020/01/03 Python
python中前缀运算符 *和 **的用法示例详解
2020/05/28 Python
Python常用类型转换实现代码实例
2020/07/28 Python
英国女性时尚精品店:THE DRESSING ROOM
2018/05/23 全球购物
施工材料员岗位职责
2014/02/12 职场文书
群众路线自查报告及整改措施
2014/11/04 职场文书
写给同事的离职感言
2015/08/04 职场文书
升学宴祝酒词
2015/08/11 职场文书
关于战胜挫折的名言警句大全!
2019/07/05 职场文书
《艾尔登法环》发布最新「战技」宣传片
2022/04/03 其他游戏