广告
返回顶部
首页 > 资讯 > 后端开发 > Python >详解JavaScript编程中的window与window.screen对象
  • 606
分享到

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

详解对象window 2022-06-04 19:06:46 606人浏览 安东尼

Python 官方文档:入门教程 => 点击学习

摘要

Window 对象 所有浏览器都支持 window 对象。它表示浏览器窗口。 所有 javascript 全局对象、函数以及变量均自动成为 window 对象的成员。 全局变量是 window 对象的属性。

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

--结束END--

本文标题: 详解JavaScript编程中的window与window.screen对象

本文链接: https://www.lsjlt.com/news/15700.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 详解JavaScript编程中的window与window.screen对象
    Window 对象 所有浏览器都支持 window 对象。它表示浏览器窗口。 所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。 全局变量是 window 对象的属性。...
    99+
    2022-06-04
    详解 对象 window
  • 理解JavaScript中window对象的一些用途
    目录前言浏览器对象模型浏览器环境深入全局变量对话框谨慎使用原生对话框浏览器信息Navigator对象URL浏览器历史控制窗口烦人的弹框屏幕信息更适用于移动平台谨慎使用文档对象docu...
    99+
    2022-11-13
  • JavaScript面向对象编程详细讲解
    这篇文章主要介绍“JavaScript面向对象编程详细讲解”,在日常操作中,相信很多人在JavaScript面向对象编程详细讲解问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”...
    99+
    2022-10-19
  • Java语言面向对象编程思想之类与对象实例详解
    在初学者学Java的时候,面向对象很难让人搞懂,那么今天小编就来为大家把这个思想来为大家用极为简单的方法理解吧。首先我们来简单的阐述面向对象的思想。面向对象:官方的语言很抽象,我们把官方的解释和定义抛开。想想,自己有什么,对!!我们自己有手...
    99+
    2023-05-31
    java 面向对象 之类
  • 详解Java中类与对象的关系
    目录前言一、类与对象的介绍二、类的实例化三.类与对象的使用方法3.1对象的初始化3.2内存显示图四.this的使用方法总结前言 已经开始类与对象的讲解了,正式步入了Java的道路了,...
    99+
    2023-05-19
    Java类 Java对象
  • 一文详解Go的面向对象编程
    目录概述实战常规函数写法调用结构体类型上的方法调用接口类型上的方法嵌入式接口概述 Go 语言的面向对象编程有三个重要的思想:封装、继承和多态。 封装 Go 语言通过 struct 结...
    99+
    2023-05-18
    Go语言 面向对象
  • 举例讲解Python面相对象编程中对象的属性与类的方法
    python 对象的属性 进入正题,来看一个实例来了解python中类,对象中公有属性,私有属性及局部变量,全局变量的区别. root@10.1.6.200:~# cat object.py ...
    99+
    2022-06-04
    对象 面相 属性
  • 详解C语言面向对象编程中的封装
    目录前言一、面向对象基本概念什么是对象?对象与类面向对象的编程方式二、C语言实现面向对象面向对象的三大特征面向对象之封装简介代码实现–基础版代码实现-进阶版总结前言 面向...
    99+
    2022-11-13
  • javascript中的糖衣语法Promise对象详解
    目录一、Promise的诞生1、回调地狱二、Promise的行为1、Promise的语法2、Promise的方法(1)Promise.prototype.then()(2)Promi...
    99+
    2022-11-13
  • 详解Java中对象池的介绍与使用
    目录1. 什么是对象池2. 对象池解决什么问题3. 对象池的优缺点3.1 对象池的优点3.2 对象池弊端4. 对象池有什么特征5. 池的大小选择6. 对象池的使用6.1 接入6.2 ...
    99+
    2023-02-21
    Java对象池使用 Java对象池
  • Java编程思想对象的容纳实例详解
    Java提供了容纳对象(或者对象的句柄)的多种方式,接下来我们具体看看都有哪些方式。有两方面的问题将数组与其他集合类型区分开来:效率和类型。对于Java来说,为保存和访问一系列对象(实际是对象的句柄)数组,最有效的方法莫过于数组。数组实际代...
    99+
    2023-05-31
    java 对象 容纳
  • JavaScript详解类数组与可迭代对象的实现原理
    目录可迭代对象(Iterable object)Symbol.iterator把对象本身构造成迭代器String也是可迭代的String的迭代器类数组对象和可迭代对象Array.fr...
    99+
    2022-11-13
  • C#面向对象编程中开闭原则的示例详解
    目录开闭原则C# 示例改进总结在面向对象编程中,SOLID 是五个设计原则的首字母缩写,旨在使软件设计更易于理解、灵活和可维护。这些原则是由美国软件工程师和讲师罗伯特&mi...
    99+
    2022-11-13
  • 详解Android中Intent对象与Intent Filter过滤匹配过程
    如果对Intent不是特别了解,可以参见博文《详解Android中Intent的使用方法》,该文对本文要使用的action、category以及data都进行了详细介绍。如果想...
    99+
    2022-06-06
    filter intent Android
  • ES6中的Promise对象与async和await方法详解
    目录Promise封装的ajaxasync和await方法promise存在的意义:解决异步回调地狱问题三种状态:pending(进行中)、fulfilled(已成功)、reject...
    99+
    2022-12-29
    Promise对象与async和await方法 Promise与async和await
  • js中的触发事件对象event.srcElement与event.target详解
    在JavaScript中,事件对象是在事件发生时自动创建的,它包含有关事件的信息,例如事件类型、事件的目标元素等。在IE浏览器中,事...
    99+
    2023-08-08
    js
  • 详解Java面向对象中的继承与多态
    详解Java面向对象中的继承与多态?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。Java 继承与多态的深入理解1、  什么是继承,继承的特点?子类继承父类的特征和...
    99+
    2023-05-31
    java 面向对象 ava
  • Python面向对象编程之区间的插入详解
    目录一、面向对象编程的Python实例描述二、面向对象编程的Python实例的示例三、面向对象编程的Python实例的编写过程3.1 本文的集成编译环境3.2 编写Interval类...
    99+
    2022-11-11
  • C++中对象与类的详解及其作用介绍
    目录什么是对象面向过程 vs 面向对象面向过程面向对象什么是类类的格式类的成员函数函数访问权限方法一方法二方法三inline 成员函数什么是对象 任何事物都是一个对象, 也就是传说中...
    99+
    2022-11-12
  • C#面向对象编程中依赖反转原则的示例详解
    在面向对象编程中,SOLID 是五个设计原则的首字母缩写,旨在使软件设计更易于理解、灵活和可维护。这些原则是由美国软件工程师和讲师罗伯特·C·马...
    99+
    2022-11-13
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作