Window

表示一个包含DOM文档的窗口，其 document 属性指向窗口中载入的 DOM文档。使用 document.defaultView 属性可以获取指定文档所在窗口。window作为全局变量，代表了脚本正在运行的窗口，暴露给 Javascript 代码。

PS：在有标签页功能的浏览器中，每个标签都拥有自己的 window 对象；也就是说，同一个窗口的标签页之间不会共享一个 window 对象。window.resizeTo 和 window.resizeBy 等方法除外。

  • 对象常用属性

    window.innerHeight ：获得浏览器窗口的内容区域（视口viewport）的高度，包含水平滚动条(如果有的话)
    window.innerWidth ：获得浏览器窗口的内容区域（视口viewport）的宽度，包含垂直滚动条(如果有的话)
    window.location ：获取/设置 window 对象的 location, 或者当前的 URL
    window.name ：获取/设置窗口的名称
    window.pageXOffset ：返回文档/页面水平方向已滚动的像素值，window.scrollX的别名
    window.pageYOffset ：返回文档/页面在垂直方向已滚动的像素值，window.scrollY的别名

  • 对象常用方法

    window.alert() ：提示信息会话框
    window.confirm() ：确认会话框
    window.prompt() ：要求键盘输入会话框
    window.open() ：打开新的窗口
    window.close() ：关闭当前窗口
    window.requestAnimationFrame() ：告知浏览器有一个动画正在进行，请求为下一帧动画重绘窗口
    window.scroll() ：滚动窗口至文档中的特定位置，与window.scrollTo()同

Document

表示任何在浏览器中载入的网页，并作为网页内容的入口，也就是DOM 树。DOM 树包含了像 <body> 、<table> 这样的元素，以及大量其他元素。Document向网页文档本身提供了全局操作功能（例如获取页面的 URL 、在文档中创建一个新的元素）。

PS：Document 接口描述了任何类型的文档（HTML、XML、SVG等）的通用属性与方法

  • 对象常用属性

    document.body ：返回当前文档的 <body> 或 <frameset> 节点
    document.head ：返回当前文档的 <head> 元素
    document.scripts ：返回文档中所有的 <script> 元素
    document.readyState ：返回当前文档的加载状态（loading / 正在加载、interactive / 可交互、complete / 完成），当该属性值发生变化时，会在document 对象上触发readystatechange事件
    document.title ：获取或设置当前文档的标题
    document.bgColor ：获取或设置当前文档的背景色
    document.URL ：以字符串形式返回文档的地址栏链接（只读），等同于document.location.href（可写）
    document.location ：返回当前文档的 Location 对象，包含有文档的 URL 相关的信息（href、protocol、host、port等）

    PS：document.location = 'http://www.example.com'等同于document.location.href = 'http://www.example.com'

  • 对象常用方法

    document.createAttribute() ：创建并返回一个新的属性节点
    document.createElement() ：创建由tagName指定的HTML元素，或一个HTMLUnknownElement，如果tagName不被识别
    document.getElementsByClassName() ：返回一个包含了所有指定类名的子元素的类数组对象
    document.getElementsByTagName() ：返回一个包括所有给定标签名称的元素的HTML集合HTMLCollection
    document.getElementById() ：返回一个匹配特定 ID的元素
    document.getElementsByName() ：根据给定的属性name值返回一个在 (X)HTML document的节点列表集合
    document.querySelector() ：返回文档中与指定选择器或选择器组匹配的第一个 html元素Element，如果找不到匹配项，则返回null
    document.close() ：用于结束对文档的 document.write() 写入操作，这种写入操作一般由 document.open() 打开

参考资料

1、Window：https://developer.mozilla.org/zh-CN/docs/Web/API/Window
2、Document：https://developer.mozilla.org/zh-CN/docs/Web/API/Document

Window与Document的更多相关文章

  1. window、document、html、body、element的事件属性比较

    在分析jQuery的事件的时候有提到绑定事件的方式: Dean Edwards的跨浏览器事件绑定使用的方式是 element["on" + type] = handleEvent; ...

  2. 拉动滚动条追加内容,无限延伸document高度 $(window).scroll(function(){if($(window).scrollTop() + $(window).height() == $(document).height()) { $("body").append(html) } })

    $(document).ready(function() { // endless scrolling $(window).scroll(function() { if($(window).scrol ...

  3. 客户端JavaScript（window、document、element）

    一.window对象是所有客户端JavaScript特性和API的主要接入点,用window来引用它. 属性:location属性(引用Location对象,当前显示在窗口的URL).document ...

  4. window.parent.document jquery

    使用 jQuery ,写法如下: .$("#myEle", window.parent.document).html(html); 另外还有一种实现方式,代码如下: .parent ...

  5. nuxt Window 或 Document未定义解决方案

    概述 在用nuxt开发服务端渲染项目并引入第三方库的时候,经常会遇到window或document未定义的情况,原因是这个第三方库里面用到了window或者document,然后在服务端打包的时候,n ...

  6. 解决 jQuery 实现父窗口的问题 如window.parent.document.getElementById().innerHTML

    因为先前遇到的问题,所以我考虑采用 IFRAME 来隔离不同的脚本,从而实现我需要的效果. 在框架中,我用 JavaScript 获取 JSON 数据,组织成 HTML 代码,最后将其填充至上层文档的 ...

  7. window.jQuery || document...

    window是浏览器端的全部数据变量的引用.比如 window.window === window window.jQuery 就是浏览器中的全局变量里的jQuery那为什么不写 jQuery 而是写 ...

  8. window.parent.document解决原生js或jQuery 实现父窗口的问题

    做WEB前端开发的过程中,经常会有这样的需求,用户点击[编辑]按钮,弹出一个对话框,在里边修改相应的值,然后把修改后的值显示在原页面,最后点击保存. 用window.parent.document.g ...

  9. window.jQuery || document.write("<script src='__PUBLIC__/assets/js/jquery.js'>"+"<"+"/script>")

    今天无意中看到这样一段代码 <script type="text/javascript"> window.jQuery || document.write(" ...

  10. javascript中window与document对象、setInterval与setTimeout定时器的用法与区别

    一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...

随机推荐

  1. LeetCode——Nth Highest Salary

    Write a SQL query to get the nth highest salary from the Employee table. +----+--------+ | Id | Sala ...

  2. 一文带你了解JavaScript函数式编程

    摘要: 函数式编程入门. 作者:浪里行舟 Fundebug经授权转载,版权归原作者所有. 前言 函数式编程在前端已经成为了一个非常热门的话题.在最近几年里,我们看到非常多的应用程序代码库里大量使用着函 ...

  3. 21个极大提高开发效率的VS Code快捷键

    摘要: 高效使用VS Code! 作者:前端小智 原文:21 个VSCode 快捷键,让代码更快,更有趣 Fundebug经授权转载,版权归原作者所有. 注意:自己尝试的时候,Mac(17, pro) ...

  4. 使用python来反查数据表中的字段名

    1. 链接数据库 import psycopg2 conn = psycopg2.connect(user,host,port,database,password) cur = conn.cursor ...

  5. Eric6 黑色风格配置

    界面风格-黑色主题 1.设置-首选项-界面-风格选择Fusion,再配置题样式表选择路径下的eric6\Styles选择[Chinese_Dark.qss]进行修改. ​ 编辑器风格 2.选择完毕后, ...

  6. Hello，DTOS！（中）

    org 0x7c00   //主引导程序的入口地址为0x7c00(物理地址),类似于用c或c++程序中的main函数. start:  //定义标签,标签的含义就是mov ax,cs这条指令的地址. ...

  7. 201871010128-杨丽霞《面向对象程序设计（java）》第十六周学习总结

    201871010128-杨丽霞<面向对象程序设计(java)>第十六周学习总结(1分) 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-dai ...

  8. day23_7.29 多态和类的内置方法

    一.多态 在现实生活中,多态也会体现.如对于水这种物质,有固态:冰,液态:常态,气态:水蒸气, 在程序中,其官方定义是:多个不同对象可以相应同一方法,产生不同的结果. 而在python中,多态不是一个 ...

  9. FastDfs的搭建

    一.什么是FastDFS FastDFS是用c语言编写的一款开源的分布式文件系统.FastDFS为互联网量身定制,充分考虑了冗余备份.负载均衡.线性扩容等机制,并注重高可用.高性能等指标,使用Fast ...

  10. python27期day17：re、logging日志模块、作业。

    1.re: 正则就是用一些具有特殊含义的符号组合到一起(称为正则表达式)来描述字符或者字符串的方法.或者说:正则就是用来描述一类事物的规则.(在Python中)它内嵌在Python中,并通过 re 模 ...