关于文档加载的方法

怎么排版啊啊啊。。。

1、首先用的最多的jQuery中有3种针对文档加载的方法

1 $(document).ready(function() {
2     // ...代码...
3 })
//document ready 简写
$(function() {
    // ...代码...
})
$(document).load(function() {
    // ...代码...
})

其中第二种是第一种的简写方式。

.ready和.load区别

先了解DOM文档加载的步骤:  

(1) 解析HTML结构。
(2) 加载外部脚本和样式表文件。
(3) 解析并执行脚本代码。
(4) 构造HTML DOM模型。//ready
(5) 加载图片等外部文件。
(6) 页面加载完毕。//load

可见.ready在第4步的时候已经执行,而在第6步时才触发.load事件。即.ready事件先执行。

2、javascript针对文档加载的方法

1 //支持IE9及以上
2 <script>
3   document.addEventListener("DOMContentLoaded", function(event) {
4     console.log("DOM fully loaded and parsed");
5   });
6 </script>
1 window.addEventListener("load", function() {
2     // ...代码...
3 }, false);

DOMContentLoaded 和 onload

DOMContentLoaded    当初始HTML文档已经完成加载和解析时,而无需等待样式表,图像和子帧的完全加载。——MDN

onload    事件触发时,页面上所有的DOM,样式表,脚本,图片,flash都已经加载完成了。

可见onload效果类似JQuery中.load()方法。

具体DOMContentLoaded兼容及加载不解释。可参考http://www.cnblogs.com/hh54188/archive/2013/03/01/2939426.html?utm_source=tuicool&utm_medium=referral

时间: 04-07

关于文档加载的方法的相关文章

当前不会命中断点 还没有为该文档加载任何符号 的处理方法

一.删除引用项目的debug 二.配置管理器中把所有项目的“生成”打勾.“配置”全部选成“debug“,切忌release 三.配置管理器中“活动解决方案配置”.新建一个方案 四.将引用目录统一设到某个目录,防止没有引用到最新的(源码与dll版本不匹配) 五.工具.选项.调试.常规中的“要求源文件和原始版本完全匹配”的勾去掉 Web项目要注意: 把webconfig里的debug设置为true(要检查子目录是否已经存在WebConfig文件了,会覆盖根目录的属性) <system.web> &

jquery文档加载几种写法,图片加载写法

jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函数. $(window).load(function() { });//调用window对象下的load方法传入一个函数. (function() { })(jQuery)//()()表示立即执行 并且传入jquery = $ 所以之前$也可以替换为jQuery 注意: jquery的ready只是

VC:当前不会命中断点,还没有为该文档加载任何符号

VS2013中设置的断点无效:"当前不会命中断点,还没有为该文档加载任何符号".问题主要出在没有生成调试信息.解决方法如下: (1)项目-〉属性-〉配置属性-〉C/C++-〉常规-〉调试信息格式,这里不能为"禁用". (2)项目-〉属性-〉配置属性-〉链接器-〉调试-〉生成调试信息,这里设为"是 (/DEBUG)".

当前不会命中断点 还没有为该文档加载任何符号 (转载)

VS2010,我改了下文红色部分就可以了,以下为转载内容: 相信很多人在网页编程时都遇到过这个问题,就是设置断点时给出提示,之后不能选中.我今天也碰到这个问题了,足足折磨了我一天.设置是debug没错,我也没有找到“C/C++->常规->调试信息格式”这个东东,估计是C++里的设置,我用的是C#.”将”要求源文件与原始版本完全匹配”的勾取消“我也试了还是不行,webconfig里的debug设置也是true.折腾了一天才发现,我要调试的文本所处的文件夹里还有一个webconfig,这里的deb

document.ready和onload的区别——JavaScript文档加载完成事件

文章转自:http://blog.csdn.net/kk5595/article/details/5713209 页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成.(可以说:ready 在onload 前加载!!!) 我的理解: 一般样式控制的,比如图片大小控制放在onload 里面加载; 而:jS事件触发的方法,可以在ready 里面加载; 更多内容戳这里:http://blog.

【JS教程16】jquery文档加载完再执行

jquery文档加载完再执行 将获取元素的语句写到页面头部,会因为元素还没有加载而出错,jquery提供了ready方法解决这个问题,它的速度比原生的 window.onload 更快. <script type="text/javascript"> $(document).ready(function(){ ...... }); </script> 可以简写为: <script type="text/javascript"> $

jquery.ready可以在文档加载后尽快执行对文档的操作

jquery 1.12.4中ready的关键代码 1 jQuery.ready.promise = function( obj ) { 2 if ( !readyList ) { 3 4 readyList = jQuery.Deferred(); 5 6 // Catch cases where $(document).ready() is called 7 // after the browser event has already occurred. 8 // Support: IE6-1

JavaScript文档加载和事件绑定

为了保证网页代码层次清晰,便于管理,一般HTML中只体现网页结构,具体的行为处理通过JS实现,样式则通过CSS文件管理. 在以上原则下通过JS实现行为时,一定要注意文档加载过程中,执行JS代码的时机.页面加载过程有两个事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成.(可以说:ready 在onload 前加载.) (1) 一些待调用函数定义,要在调用前定义. (2) 对于完善网页元素的JS,伴随文档

jQuery文档加载完毕的几种写法

1 <!DOCTYPE html> 2 <HTML lang="zh-CN"> 3 <HEAD> 4 <meta charset="utf-8"> 5 <TITLE>jQuery文档加载完毕的几种写法</TITLE> 6 </HEAD> 7 8 <body style=" overflow-y:scroll;overflow-x:auto;"> 9 &