Window与Document
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的更多相关文章
- window、document、html、body、element的事件属性比较
在分析jQuery的事件的时候有提到绑定事件的方式: Dean Edwards的跨浏览器事件绑定使用的方式是 element["on" + type] = handleEvent; ...
- 拉动滚动条追加内容,无限延伸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 ...
- 客户端JavaScript(window、document、element)
一.window对象是所有客户端JavaScript特性和API的主要接入点,用window来引用它. 属性:location属性(引用Location对象,当前显示在窗口的URL).document ...
- window.parent.document jquery
使用 jQuery ,写法如下: .$("#myEle", window.parent.document).html(html); 另外还有一种实现方式,代码如下: .parent ...
- nuxt Window 或 Document未定义解决方案
概述 在用nuxt开发服务端渲染项目并引入第三方库的时候,经常会遇到window或document未定义的情况,原因是这个第三方库里面用到了window或者document,然后在服务端打包的时候,n ...
- 解决 jQuery 实现父窗口的问题 如window.parent.document.getElementById().innerHTML
因为先前遇到的问题,所以我考虑采用 IFRAME 来隔离不同的脚本,从而实现我需要的效果. 在框架中,我用 JavaScript 获取 JSON 数据,组织成 HTML 代码,最后将其填充至上层文档的 ...
- window.jQuery || document...
window是浏览器端的全部数据变量的引用.比如 window.window === window window.jQuery 就是浏览器中的全局变量里的jQuery那为什么不写 jQuery 而是写 ...
- window.parent.document解决原生js或jQuery 实现父窗口的问题
做WEB前端开发的过程中,经常会有这样的需求,用户点击[编辑]按钮,弹出一个对话框,在里边修改相应的值,然后把修改后的值显示在原页面,最后点击保存. 用window.parent.document.g ...
- window.jQuery || document.write("<script src='__PUBLIC__/assets/js/jquery.js'>"+"<"+"/script>")
今天无意中看到这样一段代码 <script type="text/javascript"> window.jQuery || document.write(" ...
- javascript中window与document对象、setInterval与setTimeout定时器的用法与区别
一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...
随机推荐
- SAP S4HANA 账户组的配置里'Int.Std.Grping'选项没勾选导致ABAP程序报错
SAP S4HANA 账户组的配置里'Int.Std.Grping'选项没勾选导致ABAP程序报错 BP,试图创建一个新的vendor code, 角色是ZGM001, Grouping是G001, ...
- 英语Lignaloes沉香木LIGNALOES单词
中文名沉香木 外文名Lignaloes 国内分布两广以及云南和福建等地 国外分布印度尼西亚.马来西亚.新加坡 沉香木是珍贵的香料,被用作燃烧熏香.提取香料.加入酒中,或直接雕刻成装饰品.沉香木又名沉水 ...
- maven 学习---Maven Web应用
本教程将教你如何管理使用Maven版本控制系统管理一个基于Web项目.在这里,将学习如何创建/构建/部署和运行Web应用程序: 创建Web应用程序 要创建一个简单的java web应用程序,我们将使用 ...
- 汇编之JCC指令
版权声明:本文为博主原创文章,转载请附上原文出处链接和本声明.2019-09-06,21:59:16.作者By-----溺心与沉浮----博客园 JCC指令决定它跳不跳转跟别的没关系,只跟EFLAG标 ...
- mybatis if-else用法
demo: <select id="queryRuralCodes" resultType="string" parameterType="ma ...
- Windows下硬盘存储情况可视化工具--WinDirStat
WinDirStat是一款免费的用于Windows下硬盘空间可视化工具. 下载地址:https://windirstat.en.softonic.com/ 界面如图所示: 可以轻易看出硬盘空间使用情况 ...
- 使用策略组禁止win10某个程序运行
打开策略组:win+R----gpedit.msc 一.计算机配置——windows设置——安全设置——软件限制策略——其他规则——空白处右键,新建哈希规则 点击浏览,并不安全级别设置为不允许,选中程 ...
- python处理孤立的异常点
假设有一个列表,a = [61, 40, 70, 80, 86, 50, 88, 33, 76, 64],保存的是设备的状态值随时间的变化,超过60即为异常,但是对于孤立的异常点,我们需要将其忽略,只 ...
- 获取mac地址和扫描端口
获取IP mac地址 arp -a 10.0.0.34 扫描指定IP 1到30000端口 nmap -p1-30000 10.0.0.36
- 安装教程-VMware 12 虚拟机软件的安装
VMware 12 虚拟机软件的安装 1.实验描述 安装虚拟化软件,在物理机中搭建各种不同操作系统,为学习提供各种平台. 2.实验环境 物理机系统:Windows 10 企业版 3.实验工具 [VMw ...