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

yipeiwu_com6年前Python基础

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读取.text文件特定行的数据方法

使用python读取.text文件特定行的数据方法

如何用python循环读取下面.txt文件中,用红括号标出来的数据呢? 首先,观察数据可知,不同行的第一个数据元素不一样,所以考虑直接用正则表达式。 再加上,对读和写文件的操作,就行了...

Python对Excel按列值筛选并拆分表格到多个文件的代码

场景:集团中心下发本省数据时,并未按地市、业务拆分,现需要按地市、业务拆分并分发到地市。 本文利用Python的pandas包实现了以上场景。 注:本示例代码只实现按单列拆分,如果需要多...

python3安装crypto出错及解决方法

首先我用的python3.5的版本 问题的由来,我想通过python去实现RSA加密算法时,破解某网站的js加密认证,网上说需要安装pycrypto,我就去进行pip安装了 pip...

Python3导入自定义模块的三种方法详解

Python3导入自定义模块的三种方法详解

前话 最近跟着廖雪峰的教程学到 模块 这一节。关于如何自定义一个模块,如果大家不懂的话先来看看基本的介绍: 模块 在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来...

Python分支结构(switch)操作简介

Python当中并无switch语句,本文研究的主要是通过字典实现switch语句的功能,具体如下。 switch语句用于编写多分支结构的程序,类似与if….elif….else语句。...