5.js与jQuery入口函数执行时机
js与jQuery入口函数执行时机区别:
JS入口函数是在所有资源加载完成后,才执行。(包括:页面、外部js文件、外部css文件、图片)
jQuery入口函数,是在文档加载完成后就执行。文档加载完成指的是:DOM树加载完成后,就可以操作DOM了,不用等到所有的外部资源都加载完成。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="jquery-3.3.1.js"></script>
<style>
div{
width: 100px;
height: 100px;
margin-bottom: 10px;
}
.div1{
background: red;
}
.div2{
background: blue;
}
.div3{
background: green;
} </style>
<script>
//js
// window.onload = function () {
// //alert($(".div3").width())
// alert(document.getElementsByTagName("div")[2].clientWidth);
// }
//jquery
$(document).ready(function () {
//alert($(".div3").width());
alert(document.getElementsByTagName("div")[2].clientWidth);
})
</script>
</head>
<body>
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
</body>
</html>
5.js与jQuery入口函数执行时机的更多相关文章
- JS入口函数和JQuery入口函数
首先,讲一下它们的区别: (1)JS的window.onload事件必须要等到所有内容,以及外部图片之类的文件加载完之后,才会去执行. (2)JQuery入口函数是在所有标签加载完之后,就会去执行. ...
- [jQuery]入口函数(一) jquery.min.js 一定要单线程下载,复制粘贴容易入坑
jQuery入口函数 等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完毕 $(function () { // 此处是页面DOM加载完成的入口 }); $(document).rea ...
- 第69天:jQuery入口函数
一.jQuery入口函数 1.$(document).ready(function(){}); 2.$(function(){}); 二.事件处理程序 1.事件源 Js方式:document.get ...
- 1.jQuery入口函数 与javaScript入口函数
1.jQuery入口函数 与javaScript入口函数 JQ入口函数: $(document).ready(function(){ }); 或者 $(function(){ }) Js入口函数: w ...
- jQuery - 01. jQuery特点、如何使用jQuery、jQuery入口函数、jQuery和DOM对象的区别、jQuery选择器、
this指的是原生js的DOM对象 .css(“”):只写一个值是取值,写俩值是赋值 window.onload === $(document).ready(); $(“”):获取元素 标 ...
- jquery 入口函数
jQuery 入口函数: $(document).ready(function(){ // 执行代码 }); 或者 $(function(){ // 执行代码 }); JavaScript 入口函数: ...
- 1.jQuery入口函数
<!--注意,如果需要对ie67兼容,我们可以使用原生低版本的jquery 比如说jquery-1.12.4.js--> <!DOCTYPE html> <html la ...
- jQuery入口函数与JavaScript入口函数的区别
jQuery 的入口函数是在 html 所有标签 (DOM) 都加载之后就会去执行 JavaScript 的 window.onload 时间是等到所有内容,包括外部图片之类的文件加载完成 ...
- 01-老马jQuery教程-jQuery入口函数及选择器
前言 这套jQuery教程是老马专门为寒门子弟而录制,希望大家看到后能转发给更多的寒门子弟.视频都是免费,请参考课程地址:https://chuanke.baidu.com/s5508922.html ...
随机推荐
- fpga中wire和reg的区别
wire表示直通,即只要输入有变化,输出马上无条件地反映:reg表示一定要有触发,输出才会反映输入.wire表示直通,即只要输入有变化,输出马上无条件地反映:reg表示一定要有触发,输出才会反映输入. ...
- 图的第k短路
[问题描述] 给你一个有向图,求从1到n的第k短路. [解法] SPFA+A*搜索. 1 A*算法 A*算法在人工智能中是一种典型的启发式搜索算法,启发中的估价是用估价函数表示的: h(n)=f(n) ...
- datatables01 安装、数据源、选中行事件、新增一行数据、删除一行数据
1 安装 1.1 引入必要文件 要在项目中使用datatables需要引入三个文件 >DataTables CSS >jQuery >DataTables JS <!-- Da ...
- Luogu 3265 [JLOI2015]装备购买
BZOJ 4004 把所有不能相互表示出来的向量都买下,一定能得到最大能买的方案数. 求解线性无关向量可以高斯消元,最后没有变成$0$向量的就是基底. 本题还要求代价最小怎么办?我们只要先把所有向量按 ...
- SEO网站结构优化
结构布局优化:用扁平化结构(层次结构超过三层小蜘蛛就不愿意爬了) 控制首页链接数量(中小网站100以内,页面导航.底部导航.锚文字链接等) 扁平化的目录层次(小蜘蛛跳转3次可以到达网站内任何一个内页, ...
- libtool: syntax error near unexpected token `]*
../libtool: line 543: syntax error near unexpected token `]*' ../libtool: line 543: ` *[\[\~\#\ ...
- (11)Web程序保存状态的几种方式,Application,Session,Cookie,ViewState
WEb程序保存状态的方式有这样几种: 1.Application:保存在Application中的数据是全局有效的:Application里面存放的应该是访问多修 改较少并且是全局至少大部分 ...
- 软件工程实践一 —— java之wc.exe
SoftwareEngineering-wc github项目地址:https://github.com/CuiLam/SoftwareEngineering-wc 项目相关要求 实现一个统计程序 ...
- .net Stream篇(七)
NetworkStream 目录: NetworkStream的作用 简单介绍下TCP/IP 协议和相关层次 简单说明下 TCP和UDP的区别 简单介绍下套接字(Socket)的概念 简单介绍下Tcp ...
- Linux 命令之chmod
立贴今日吉,不断更新,欢迎斧正,支持为感! 1. chmod --权限控制 chmod [-cfvR] [--help] [--version] mode file... 说明 : Linux/Uni ...