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入口函数执行时机的更多相关文章

  1. JS入口函数和JQuery入口函数

    首先,讲一下它们的区别: (1)JS的window.onload事件必须要等到所有内容,以及外部图片之类的文件加载完之后,才会去执行. (2)JQuery入口函数是在所有标签加载完之后,就会去执行. ...

  2. [jQuery]入口函数(一) jquery.min.js 一定要单线程下载,复制粘贴容易入坑

    jQuery入口函数 等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完毕 $(function () { // 此处是页面DOM加载完成的入口 }); $(document).rea ...

  3. 第69天:jQuery入口函数

    一.jQuery入口函数 1.$(document).ready(function(){}); 2.$(function(){}); 二.事件处理程序  1.事件源 Js方式:document.get ...

  4. 1.jQuery入口函数 与javaScript入口函数

    1.jQuery入口函数 与javaScript入口函数 JQ入口函数: $(document).ready(function(){ }); 或者 $(function(){ }) Js入口函数: w ...

  5. jQuery - 01. jQuery特点、如何使用jQuery、jQuery入口函数、jQuery和DOM对象的区别、jQuery选择器、

    this指的是原生js的DOM对象 .css(“”):只写一个值是取值,写俩值是赋值 window.onload   ===   $(document).ready(); $(“”):获取元素   标 ...

  6. jquery 入口函数

    jQuery 入口函数: $(document).ready(function(){ // 执行代码 }); 或者 $(function(){ // 执行代码 }); JavaScript 入口函数: ...

  7. 1.jQuery入口函数

    <!--注意,如果需要对ie67兼容,我们可以使用原生低版本的jquery 比如说jquery-1.12.4.js--> <!DOCTYPE html> <html la ...

  8. jQuery入口函数与JavaScript入口函数的区别

    jQuery  的入口函数是在  html  所有标签 (DOM) 都加载之后就会去执行 JavaScript  的  window.onload  时间是等到所有内容,包括外部图片之类的文件加载完成 ...

  9. 01-老马jQuery教程-jQuery入口函数及选择器

    前言 这套jQuery教程是老马专门为寒门子弟而录制,希望大家看到后能转发给更多的寒门子弟.视频都是免费,请参考课程地址:https://chuanke.baidu.com/s5508922.html ...

随机推荐

  1. fpga中wire和reg的区别

    wire表示直通,即只要输入有变化,输出马上无条件地反映:reg表示一定要有触发,输出才会反映输入.wire表示直通,即只要输入有变化,输出马上无条件地反映:reg表示一定要有触发,输出才会反映输入. ...

  2. 图的第k短路

    [问题描述] 给你一个有向图,求从1到n的第k短路. [解法] SPFA+A*搜索. 1 A*算法 A*算法在人工智能中是一种典型的启发式搜索算法,启发中的估价是用估价函数表示的: h(n)=f(n) ...

  3. datatables01 安装、数据源、选中行事件、新增一行数据、删除一行数据

    1 安装 1.1 引入必要文件 要在项目中使用datatables需要引入三个文件 >DataTables CSS >jQuery >DataTables JS <!-- Da ...

  4. Luogu 3265 [JLOI2015]装备购买

    BZOJ 4004 把所有不能相互表示出来的向量都买下,一定能得到最大能买的方案数. 求解线性无关向量可以高斯消元,最后没有变成$0$向量的就是基底. 本题还要求代价最小怎么办?我们只要先把所有向量按 ...

  5. SEO网站结构优化

    结构布局优化:用扁平化结构(层次结构超过三层小蜘蛛就不愿意爬了) 控制首页链接数量(中小网站100以内,页面导航.底部导航.锚文字链接等) 扁平化的目录层次(小蜘蛛跳转3次可以到达网站内任何一个内页, ...

  6. libtool: syntax error near unexpected token `]*

    ../libtool: line 543: syntax error near unexpected token `]*' ../libtool: line 543: `      *[\[\~\#\ ...

  7. (11)Web程序保存状态的几种方式,Application,Session,Cookie,ViewState

    WEb程序保存状态的方式有这样几种: 1.Application:保存在Application中的数据是全局有效的:Application里面存放的应该是访问多修      改较少并且是全局至少大部分 ...

  8. 软件工程实践一 —— java之wc.exe

    SoftwareEngineering-wc github项目地址:https://github.com/CuiLam/SoftwareEngineering-wc   项目相关要求 实现一个统计程序 ...

  9. .net Stream篇(七)

    NetworkStream 目录: NetworkStream的作用 简单介绍下TCP/IP 协议和相关层次 简单说明下 TCP和UDP的区别 简单介绍下套接字(Socket)的概念 简单介绍下Tcp ...

  10. Linux 命令之chmod

    立贴今日吉,不断更新,欢迎斧正,支持为感! 1. chmod --权限控制 chmod [-cfvR] [--help] [--version] mode file... 说明 : Linux/Uni ...