js & jq 加载js

最近做项目中, 经常要写js代码的, 从纯前端人员, 到我们这边的过度, 每个人写的风格都不一样, 大概整理了一下有这么几种

1.1 $(document).ready(function(){});

1.2 $(function(){});

2.1 $(window).load(function(){});

2.2 window.onload = function(){}

这四种方式 前三种都是jq的方法 最后一种是js的原生方法

在作用上 前两种完全一样, 后两种完全一样

一. 接下来从执行时间上分析这两组加载 

第一组代码会在DOM树完成加载之后就立即执行

第二组代码会在整个html页面全部加载完成后才会加载, 包括图片等资源文件

二. 内部代码的执行

$(document).ready(function(){});和$(function(){}); 可以在页面中写无数个, 他们将在jq的内部合并成为一个

$(window).load(function(){}); 和window.onload = function(){}在一个html文档页面只允许出现一次, 如果出现多次, 只能执行最后一个作用域中的代码

时间: 2024-11-10 08:03:32

js & jq 加载js的相关文章

JS动态加载JS与CSS文件

JS动态加载JS与CSS文件 DEMO 一 HTML页面   jsforjscss.html 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"&

JS动态加载 js css

1.动态加载js function loadScript( url ){ var script = document.createElement( "script" ); script.type = "type/javascipt"; script.src = url; document.getElementsByTagName( "head" )[0].appendChild( script ); }; 2.动态加载CSS文件 function

require.js模块加载js

RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一.最新版本的RequireJS压缩后只有14K,堪称非常轻量.它还同时可以和其他的框架协同工作,使用RequireJS必将使您的前端代码质量得以提升. requirejs能带来什么好处 官方对requirejs的描述: RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it

也说JS脚本加载控制

问题背景 前端采用的 iframe + html 做后台管理系统.现在js.jquery插件非常多,每次页面都是引用就类似这样: <script src="../Scripts/jquery-1.7.1.js"></script> <script src="../Scripts/uploadify/jquery.uploadify.js"></script> <script src="../Script

js动态加载的方法

$(function(){ /*删除js文件*/ $("script[src='test.js']").remove(); /*加载js文件*/ $(document.createElement("script")).attr("src","test.js").appendTo("head"); $("<script type='text/javascript' src='test.js'&

JS 页面加载触发事件 document.ready和window.onload的区别

document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 1.Dom Ready 使用jq时一般都是这么开始写脚本的: $(function(){ // do something }); 例如: $(function() { $("a").click(function() { alert(&

JS 页面加载触发事件 document.ready和onload的区别

JS 页面加载触发事件 document.ready和onload的区别 document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 1.Dom Ready 用jQ的人很多人都是这么开始写脚本的: $(function(){       // do something }); 例如: $(functi

现代浏览器JS异步加载方案

好,不说废话,要凌晨了我快点写完,关于JS加载阻塞之类的不做科普,本文也不讨论IE9以下的浏览器. headjs:"异步.并行加载并按你的顺序执行",这个是最符合广大码农需求的,只是它越来越臃肿,连CSS Respone什么的都加进去了,没必要那么复杂 Loadjs:今天刚刚出现在OSC首页本人疯狂测试后发现,如果需要并行加载就是乱序的(哪个JS先下载完就先执行谁),如果要顺序下载就不能并发,经测试是下载一个执行一个,每个JS文件之间有10ms的空隙(JS下载和加载时所有渲染操作都要暂

动态加载js文件

动态加载js并执行方法(先js再调用方法) 方法一:// jq封装方法获取到js成功后 再执行initMap(); jQuery.getScript()函数用于通过HTTP GET形式的加载JavaScript文件并运行它 函数可以加载跨域的JS文件.请注意,该函数是通过异步方式加载数据的. $.getScript("http://webapi.amap.com/maps?v=1.3&key=fc1cc89768a5da46f78aaed607835069",function(