JS在页面加载之后运行
2024-09-20 20:09:35
通用的页面加载后再运行JS有两种方式:1、在DOM加载完毕后,页面全部内容(如图片等)完全加载完毕前运行JS。 2、在页面全部内容加载完成(包括引用文件,图片等)之后再加载JS
1、在DOM加载后,全部内容加载前运行
这种方式在同一文件中可以运行多个且不会覆盖。
由于在$(document).ready()方法只要DOM就绪就会被执行,因此可能此时元素的关联文件未下载完。例如与图片有关的HTML下载完毕,并且已经解析为DOM树了,但很有可能图片还未加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用Jquery中 load()方法在需要的文件加载完毕后对其进行操作。
$(document).ready(function(){});
$().ready(function(){}) //简写 当$()不带参数时默认就是document
$(function(){}); //简写
2、在全部内容加载后运行
这种方式中只能执行一个 onload代码,当文件由多个onload或者load,只加载最后一个,前面的将会被覆盖且前面的onload里面的代码不会执行。
window.onload = function(){}; // —-js
$(window).load(function(){}); //---jquery
3、DOM文档加载步骤
1.解析HTML结构
2.加载外部的脚本和样式文件
3.解析并执行脚本代码
4.执行$(function(){})内对应代码
5.加载图片等二进制资源
6.页面加载完毕,执行window.onload
最新文章
- 【20160924】GOCVHelper 图像增强部分(1)
- 81 Search in Rotated Sorted Array II
- 一道关于java 类初始化 成员初始化的笔试题的解析
- 基础 ADO.NET 访问MYSQL 与 MSSQL 数据库例子
- C++面试问题总结
- C++类静态成员变量和const常量的初始化方法
- currentstyle和getComputedStyle兼容问题
- Tiny6410之LED裸机驱动
- 同时只允许Count个线程访问同一块区域的实现方式
- ubuntu12.04destdrop删除不必要的软件
- 记录github出错及解决方案
- spark RDD,reduceByKey vs groupByKey
- 部署一个基于python语言的web发布环境
- javascript 数组函数
- 策略模式与SPI机制,到底有什么不同?
- Laravel Composer 脚本
- 4. Stacked AutoEncoder(堆栈自动编码器)
- 【前端安全】JavaScript防http劫持与XSS (转)
- Android事件分发机制浅析(2)
- (转)mysql双机热备的实现