详解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获取服务器信息的最简单实现方法
Mar 05 Python
python制作爬虫爬取京东商品评论教程
Dec 16 Python
Python爬虫获取图片并下载保存至本地的实例
Jun 01 Python
Anaconda 离线安装 python 包的操作方法
Jun 11 Python
python 移除字符串尾部的数字方法
Jul 17 Python
Django模型序列化返回自然主键值示例代码
Jun 12 Python
Django框架视图层URL映射与反向解析实例分析
Jul 29 Python
Python django搭建layui提交表单,表格,图标的实例
Nov 18 Python
wxpython+pymysql实现用户登陆功能
Nov 19 Python
在TensorFlow中屏蔽warning的方式
Feb 04 Python
Python reversed函数及使用方法解析
Mar 17 Python
python常见的占位符总结及用法
Jul 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.ini中文版(1)
2006/10/09 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(三)
2014/06/23 PHP
PHP中如何使用session实现保存用户登录信息
2015/10/20 PHP
jquery 子窗口操作父窗口的代码
2009/09/21 Javascript
Ext.get() 和 Ext.query()组合使用实现最灵活的取元素方式
2011/09/26 Javascript
javascript中处理时间戳为日期格式的方法
2014/01/02 Javascript
jquery自定义函数的多种方法
2014/01/09 Javascript
javascript获取form里的表单元素的示例代码
2014/02/14 Javascript
js用闭包遍历树状数组的方法
2014/03/19 Javascript
javascript中的循环语句for语句深入理解
2014/04/04 Javascript
javascript快速排序算法详解
2014/09/17 Javascript
js监听鼠标点击和键盘点击事件并自动跳转页面
2014/09/24 Javascript
node.js中的fs.symlink方法使用说明
2014/12/15 Javascript
javascript实现checkbox全选的代码
2015/04/30 Javascript
JS简单实现tab切换效果的多窗口显示功能
2016/09/07 Javascript
javascript基于原型链的继承及call和apply函数用法分析
2016/12/15 Javascript
详解vue-cli本地环境API代理设置和解决跨域
2017/09/05 Javascript
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
Angular6笔记之封装http的示例代码
2018/07/27 Javascript
jquery ajax 请求小技巧实例分析
2019/11/11 jQuery
微信小程序用户盒子、宫格列表的实现
2020/07/01 Javascript
ant design vue导航菜单与路由配置操作
2020/10/28 Javascript
python下实现二叉堆以及堆排序的示例
2017/09/29 Python
Linux下python3.7.0安装教程
2018/07/30 Python
自学python的建议和周期预算
2019/01/30 Python
Django 实现图片上传和显示过程详解
2019/07/18 Python
Python3利用openpyxl读写Excel文件的方法实例
2021/02/03 Python
Python命令行参数argv和argparse该如何使用
2021/02/08 Python
大学生学习党课思想汇报
2014/01/03 职场文书
公司管理建议书范文
2014/03/12 职场文书
合同和协议有什么区别?
2014/10/08 职场文书
创业计划书之花店
2019/09/20 职场文书
使用qt quick-ListView仿微信好友列表和聊天列表的示例代码
2021/06/13 Python
详解Python requests模块
2021/06/21 Python
用php如何解决大文件分片上传问题
2021/07/07 PHP
python周期任务调度工具Schedule使用详解
2021/11/23 Python