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. 将.sql文件导入powerdesigner的实现方法详解

    将.sql文件导入powerdesigner的步骤是本文我们主要要介绍的内容,步骤如下: 第一步:将要导入的库的所有表的表结构(不要表数据,只要表结构)导出成一个.sql文件. 第二步:在powerd ...

  2. Subscript & Inheritance

    [Subscript] 1.subscript的定义: 2.Subscript的使用: 3.可以定义多维subscript: 多维Subscript的使用: [Inheritance] 1.overr ...

  3. selenium2 定位 窗体切换等等 （二）

    定位用的html素材有两个 demo.html <html> <head> <title>UI Automation Testing</title> & ...

  4. 557. Reverse Words in a String III 翻转句子中的每一个单词

    ［抄题］: Given a string, you need to reverse the order of characters in each word within a sentence whi ...

  5. 启动dhcp出错：No subnet declaration for eth0 (192.168.0.1

    XUbuntu 8.04 i386.装了dhcp3-server.使用 sudo /etc/init.d/dhcp3-server start 出错:Apr 30 14:24:03 s dhcpd: ...

  6. 19-字符串匹配(kmp || substr,find)

    链接:https://www.nowcoder.com/acm/contest/77/C来源:牛客网 时间限制:C/C++ 2秒,其他语言4秒 空间限制:C/C++ 262144K,其他语言52428 ...

  7. ef增删改查

    [C#]Entity Framework 增删改查和事务操作 1.增加对象 DbEntity db = new DbEntity(); //创建对象实体,注意,这里需要对所有属性进行赋值(除了自动增长 ...

  8. nodelet的理解

    1.介绍 nodelet包可以为在相同进程中的多个算法之间实现零拷贝的传输方式. 这个包也提供了实现一个nodelet所需的nodelet基类以及用于实例化nodelet的NodeletLoader类 ...

  9. Web API集成Azure AD认证

    1.声明的介绍 基于角色的授权管理,适用于角色变化不大,并且用户权限不会频繁更改的场景. 在更复杂的环境下,仅仅通过给用户分配角色并不能有效地控制用户访问权限. 基于声明的授权有许多好处,它使认证和授 ...

  10. javascript总结9:JavaScript三目运算符

    1 三元表达式: 表达式?结果1:结果2: 如果表达式结果为true,执行结果1,如果表达式结果为false,执行结果2. 可以理解为if else  的另外一种写法. 例: var m = 10; ...