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. Python代码的编译

    Python代码的编译 Python代码在解释执行之前,是会被编译成.pyc或者.pyo文件的,它们是中间字节码表示的文件,之后Python虚拟机才会去解释执行它们. 1.pyc文件 ======== ...

  2. php 读取和下载execl

    最近用到php 对excel 的操作 下来 小弟为大家 先贴一下自己的代码  有什么补充的 大神们请指点下.感激不尽. 我用的是yii2   yii2中有类 phpexcel 先说说下载吧. 首先下载 ...

  3. rosbag数据记录及转换图片、视频

    博客转载自: https://blog.csdn.net/u012706484/article/details/78495896 rosbag常见的使用参数和配置 1.查看.bag中包含的信息 : r ...

  4. tensorflow 中 feed的用法

    Feed 上述示例在计算图中引入了 tensor, 以常量或变量的形式存储. TensorFlow 还提供了 feed 机制, 该机制 可以临时替代图中的任意操作中的 tensor 可以对图中任何操作 ...

  5. 前端基础 之 Bootstrap框架

    浏览目录 Bootstrap介绍 为什么要使用Bootstrap? Bootstrap环境搭建 布局容器 栅格系统 Bootstrap全局样式 一.Bootstrap介绍 Bootstrap是Twit ...

  6. Spring Boot 启动失败,描述/Description: Cannot determine embedded database driver class for database type NONE

    异常截图====> 快速解决方式==> 在SpringBoot的启动类上面添加注解:@EnableAutoConfiguration(exclude={DataSourceAutoConf ...

  7. 基于Ajax的文件上传使用FileInput插件(使用谷歌翻译作者的原文,大致意思是对的,自己把握)

    bootstrap-fileinput 说明文档:http://plugins.krajee.com/file-input 有许多人希望学习使用bootstrap-fileinput jQuery插件 ...

  8. 设计模式07: Bridge 桥接模式(结构型模式)

    Bridge 桥接模式(结构型模式) 抽象与实现 抽象不应该依赖于实现细节,实现细节应该依赖于抽象. 抽象B稳定,实现细节b变化 问题在于如果抽象B由于固有的原因,本身并不稳定,也有可能变化,怎么办? ...

  9. Ubuntu 16.04 安装jdk

    Ubuntu 16.04 安装jdk 准备工作 安装版本:jdk-8u91-linux-x64.tar.gz 官方下载 创建目录作为JDK的安装目录,这里选择安装位置为:/usr/java/ sudo ...

  10. Dijstra算法-------为了纪念,等以后看的时候方便

    杭电problem2066 Time Limit : 1000/1000ms (Java/Other)   Memory Limit : 32768/32768K (Java/Other) Total ...