`
eric_hwp
  • 浏览: 126606 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

document.readyState等属性

 
阅读更多

document.readyState:判断文档是否加载完成。firefox不支持。

这个属性是只读的,传回值有以下的可能:

0-UNINITIALIZED:XML 对象被产生,但没有任何文件被加载。
1-LOADING:加载程序进行中,但文件尚未开始解析。
2-LOADED:部分的文件已经加载且进行解析,但对象模型尚未生效。
3-INTERACTIVE:仅对已加载的部分文件有效,在此情况下,对象模型是有效但只读的。
4-COMPLETED:文件已完全加载,代表加载成功。

document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法.
function subSomething()
{
if(document.readyState == "complete"){ //当页面加载状态为完全结束时进入
//你要做的操作。

else if(document.readyState=="loading"){

}

}

比较好的例子:http://www.jb51.net/article/20445.htm

说明 :onreadystatechange 事件能辨识readyState 属性的改变。

document.all(只被IE支持)

action:document.layers是Netscape 4.x专有的属性,是一个代表所有由储如<div><layer>等定位了的元素的数组通常也是用<div> 或<layer>对象的id属性来引用的,但是这里面不包含除此以外的其它元素

document.layers和document.all的用法是一样的,功能也是相同的。所在我就只介绍一种用法:
document.all的意思是文档的所有元素,也就是说它包含了当前网页的所有元素。它是以数组的形式保存元素的属性的,所以我们可以用 document.all["元素名"].属性名="属性值"来动态改变元素的属性。用这条语句,可以做出许许多多动态网页效果,如:动态变换图片、动态改变文本的背景、动态改变网页的背景、动态改变图片的大小、动态改变文字的大小各颜色等等。你简直可以动态控制所有网页元素。 
document.all[]这个数组可以访问文档中所有元素。

 

仔细查看代码,发现在Mozilla添加了DOMContentLoaded事件,这个在以前一直没有用过。                    if (document.addEventListener)
                        document.addEventListener("DOMContentLoaded", init, false);

好像就是为了兼容实现DOMContentLoaded事件。

网上找了点有关DOMContentLoaded的资料拿来看看。

DOMContentLoaded是firefox下特有的Event, 当所有DOM解析完以后会触发这个事件。
    与DOM中的onLoad事件与其相近。但onload要等到所有页面元素加载完成才会触发, 包括页面上的图片等等。
    如果页面的图片很多的话, 从用户访问到onload触发可能需要较长的时间, 而在Ajax运用中, 常常需要在onload中加入许多初始化的动作, 如果由于网络问题引起的图片加载过慢( 见: Ajax优化(2) -- lazierLoad img && js), 则必然影响用户的体验。
    在这种情况下firefox的DOMContentLoaded事件, 恰恰是我们需要的。

    目前,跨平台的DOMContentLoaded的解决方案有很多, 比如jQuery, Prototype...等等, 其实现原理大同小异.

分享到:
评论

相关推荐

    javascript-document对象详解(下).zip

    最后,`29.javascript-document对象详解(下).wmv`可能是一个视频教程,通过直观的方式演示如何使用`document`对象进行网页动态交互,包括元素的查找、修改和事件绑定等。视频教程通常会更有利于理解这些概念的实际...

    document 文挡对象详解

    - `document.readyState`:返回表示文档加载状态的字符串,如"loading"、"interactive"、"complete"。 - `document.open()`:开始重新加载文档。 - `document.close()`:完成文档流的写入,开始解析文档。 5. **...

    用javascript实现jquery的document.ready功能的实现代码

    1. **检测文档加载状态**:在原生JavaScript中,可以通过监听`DOMContentLoaded`事件或者检查`document.readyState`属性来判断文档是否加载完成。 2. **注册回调函数**:提供一个接口,允许用户注册回调函数,当文档...

    javascript经典特效---打开页面的等待(三).rar

    - `document.readyState`:可以使用`'loading'`、`'interactive'`和`'complete'`三个状态来判断页面的加载进度。在状态变为`'interactive'`时,DOM已经构建完成,可以显示等待效果;在状态变为`'complete'`时,页面...

    documen对象参考手册使用详解

    5. **文档加载和加载状态**:`document.readyState`属性指示文档的加载状态,当其值为`"complete"`时,表示页面已经完全加载。`window.onload`事件通常用于在页面加载完成后执行的函数。 6. **表单操作**:对于网页...

    javascriptDom节点API个人总结.docx

    - **`document.readyState`** 返回当前文档的加载状态。可能的值包括 `"loading"`, `"interactive"`, 和 `"complete"`。 - **`document.designMode`** 控制当前文档是否处于可编辑模式。可以设置为 `"on"` 或 `...

    js加载检测

    2. **IE 6、IE 7** 不支持`js.onload`,但提供了`js.onreadystatechange`事件,可以通过检查`readyState`属性来判断脚本加载状态。 3. **Opera** 实际上也支持`js.onreadystatechange`,但其状态与IE有所不同。 ###...

    javascript页面加载完执行事件代码

    在JavaScript中,可以通过监听document对象的readyState属性变化来判断页面是否加载完毕。readyState属性用于描述当前文档的加载状态,有以下几种值: - loading:页面正在加载中。 - interactive:页面已经完成DOM...

    基于javascript原生判断DOM是否加载完毕

    文档状态属性`document.readyState`可以返回当前文档的状态,有以下几种状态值: - `uninitialized`:还未开始加载; - `loading`:加载中; - `interactive`:已加载,文档与用户可以开始交互; - `complete`:加载...

    解决IE,Firefox,chrome,safari浏览器中iframe显示高度自适应问题

    它首先检查整个文档是否已经完全加载(通过`document.readyState`属性)。如果没有,设置一个50毫秒的延时再次尝试。如果文档已经加载完成,尝试获取`iframe`对象,并将其高度设置为其内部文档的`scrollHeight`加上...

    webbrowset操作纪要

    2. **设置背景图片**:通过`document.body.background`属性设置背景图片。 ```delphi WebBrowser1.OleObject.document.body.background := '图片路径'; ``` #### 八、获取页面元素信息 1. **获取特定ID的元素...

    关于IE11修改User-agent不再支持document.all等

    3. script.readyState:此属性用于获取IE中脚本的加载状态。随着标准的推进,应使用标准的onload事件来代替。 4. document.selection:这是IE中用来获取用户选中内容的方式。应使用标准的document.getSelection()或...

    前端面试题目整理

    - **document.readyState**: 返回当前文档的状态。 以上是关于前端开发中常用的 DOM 操作和文档属性的详细解释,这些都是面试时经常被问到的基础知识点,掌握这些内容对于前端工程师来说至关重要。通过理解和运用...

    jQuery中使用了document和window哪些属性和方法小结

    5. **document.readyState**:返回文档的加载状态,包括uninitialized、loading、loaded、interactive和complete,jQuery的`$(document).ready()`函数就是基于此属性来判断DOM是否加载完成。 6. **document....

    html_document对象

    通过巧妙地运用`document`对象的各种方法和属性,开发者可以实现网页的动态交互、内容更新、响应式设计等高级功能,极大地提升了用户体验。例如,使用`addEventListener`结合`DOMContentLoaded`事件可以确保在页面...

    JavaScript跨域总结与解决办法

    this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') { // 在此处执行回调函数 js.onload = js.onreadystatechange = null; // 避免多次触发 } }; document.head.appendChild...

    js下判断 iframe 是否加载完成的完美方法.docx

    接着,我们添加了一个 onreadystatechange 事件处理函数,该函数将在 iframe 的 readyState 属性变化时触发。 总结 判断 iframe 是否加载完成是一个重要的步骤,在我们的开发中,我们可以使用以上三种方法来判断 ...

    document_plus:HTML元素控制器

    5. **文档加载状态**: `document.readyState`表示文档加载进度,`document.onload`或`window.onload`事件可监听页面完全加载。 6. **查询和遍历**: `document.getElementsByName`, `document.getElementsByTagName`...

    通过JS动态向网页中添加CSS样式语句代码

    2. **使用`document.styleSheets`**:JavaScript还提供了`document.styleSheets`属性,它是一个包含所有已加载样式表的列表。你可以向这个列表添加新的CSS规则。例如: ```javascript let sheet = document.style...

Global site tag (gtag.js) - Google Analytics