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 ...
随机推荐
- Python代码的编译
Python代码的编译 Python代码在解释执行之前,是会被编译成.pyc或者.pyo文件的,它们是中间字节码表示的文件,之后Python虚拟机才会去解释执行它们. 1.pyc文件 ======== ...
- php 读取和下载execl
最近用到php 对excel 的操作 下来 小弟为大家 先贴一下自己的代码 有什么补充的 大神们请指点下.感激不尽. 我用的是yii2 yii2中有类 phpexcel 先说说下载吧. 首先下载 ...
- rosbag数据记录及转换图片、视频
博客转载自: https://blog.csdn.net/u012706484/article/details/78495896 rosbag常见的使用参数和配置 1.查看.bag中包含的信息 : r ...
- tensorflow 中 feed的用法
Feed 上述示例在计算图中引入了 tensor, 以常量或变量的形式存储. TensorFlow 还提供了 feed 机制, 该机制 可以临时替代图中的任意操作中的 tensor 可以对图中任何操作 ...
- 前端基础 之 Bootstrap框架
浏览目录 Bootstrap介绍 为什么要使用Bootstrap? Bootstrap环境搭建 布局容器 栅格系统 Bootstrap全局样式 一.Bootstrap介绍 Bootstrap是Twit ...
- Spring Boot 启动失败,描述/Description: Cannot determine embedded database driver class for database type NONE
异常截图====> 快速解决方式==> 在SpringBoot的启动类上面添加注解:@EnableAutoConfiguration(exclude={DataSourceAutoConf ...
- 基于Ajax的文件上传使用FileInput插件(使用谷歌翻译作者的原文,大致意思是对的,自己把握)
bootstrap-fileinput 说明文档:http://plugins.krajee.com/file-input 有许多人希望学习使用bootstrap-fileinput jQuery插件 ...
- 设计模式07: Bridge 桥接模式(结构型模式)
Bridge 桥接模式(结构型模式) 抽象与实现 抽象不应该依赖于实现细节,实现细节应该依赖于抽象. 抽象B稳定,实现细节b变化 问题在于如果抽象B由于固有的原因,本身并不稳定,也有可能变化,怎么办? ...
- Ubuntu 16.04 安装jdk
Ubuntu 16.04 安装jdk 准备工作 安装版本:jdk-8u91-linux-x64.tar.gz 官方下载 创建目录作为JDK的安装目录,这里选择安装位置为:/usr/java/ sudo ...
- Dijstra算法-------为了纪念,等以后看的时候方便
杭电problem2066 Time Limit : 1000/1000ms (Java/Other) Memory Limit : 32768/32768K (Java/Other) Total ...