[jQuery]入口函数(一) jquery.min.js 一定要单线程下载,复制粘贴容易入坑
jQuery入口函数
- 等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完毕
$(function () {
// 此处是页面DOM加载完成的入口
});
$(document).ready(function () {
// 此处是页面DOM加载完成的入口
$('div').hide()
);
演示代码
- 由于本人使用Flask Jinjia2注释样式为 {# #}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{# <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>#}
<script src="../static/jquery.min.js"></script>
<style>
div {
width: 200px;
height: 200px;
background-color: pink;
}
</style>
</head>
<body>
<h1>Hello the World</h1>
<script type="text/javascript">
# 最原始的写法但是要求DIV提前加载
$('div').hide();
# 方法1. 等着DOM加载完毕后再去执行js代码
$(document).ready(function () {
$('div').hide()
});
# 方法2. 等着DOM加载完毕后再去执行js代码 隐藏DIV
$(function(){
$('div').hide();
});
</script>
<div></div>
</body>
</html>
END
[jQuery]入口函数(一) jquery.min.js 一定要单线程下载,复制粘贴容易入坑的更多相关文章
- jQuery - 01. jQuery特点、如何使用jQuery、jQuery入口函数、jQuery和DOM对象的区别、jQuery选择器、
this指的是原生js的DOM对象 .css(“”):只写一个值是取值,写俩值是赋值 window.onload === $(document).ready(); $(“”):获取元素 标 ...
- 5.js与jQuery入口函数执行时机
js与jQuery入口函数执行时机区别: JS入口函数是在所有资源加载完成后,才执行.(包括:页面.外部js文件.外部css文件.图片) jQuery入口函数,是在文档加载完成后就执行.文档加载完成指 ...
- JS入口函数和JQuery入口函数
首先,讲一下它们的区别: (1)JS的window.onload事件必须要等到所有内容,以及外部图片之类的文件加载完之后,才会去执行. (2)JQuery入口函数是在所有标签加载完之后,就会去执行. ...
- 01-老马jQuery教程-jQuery入口函数及选择器
前言 这套jQuery教程是老马专门为寒门子弟而录制,希望大家看到后能转发给更多的寒门子弟.视频都是免费,请参考课程地址:https://chuanke.baidu.com/s5508922.html ...
- 1.jQuery入口函数
<!--注意,如果需要对ie67兼容,我们可以使用原生低版本的jquery 比如说jquery-1.12.4.js--> <!DOCTYPE html> <html la ...
- 第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——入口函数
中文网 http://www.css88.com/jqapi-1.9/ 版本兼容问题 版本一:1.x版本,兼容IE678 版本二:2.x版本,不兼容IE678 入口函数区别 <script> ...
- jquery 入口函数
jQuery 入口函数: $(document).ready(function(){ // 执行代码 }); 或者 $(function(){ // 执行代码 }); JavaScript 入口函数: ...
随机推荐
- bootstrap4popper.js报错Uncaught ReferenceError
这是因为bootstrap4需要umd版的popper.js <script src="https://cdn.bootcss.com/popper.js/1.15.0/umd/pop ...
- 数字任意组合 - gcd
链接:https://www.nowcoder.com/acm/contest/160/A来源:牛客网 题目描述有一个计数器,计数器的初始值为0,每次操作你可以把计数器的值加上a1,a2,...,an ...
- Git创建远程分支并提交代码到远程分支
1.可以在VS中新建分支 2.可以通过git branch -r 命令查看远端库的分支情况 这些红色都是远程的分支 3.从已有的分支创建新的分支(如从master分支),创建一个dev分支 (不用vs ...
- 初探ASP.NET Core 3.x (3) - Web的运作流程和ASP.NET Core的运作结构
本文地址:https://www.cnblogs.com/oberon-zjt0806/p/12215717.html 注意:本篇大量地使用了mermaid绘制图表,加载需要较长的时间,请见谅 [TO ...
- .net core webapi搭建(3)Code first+拆层三层+仓储
将项目拆层 我们要 将项目拆分成 Infrastructure 基础层 Core 核心层 Utility 工具 我们想在就 ...
- Python3基础之初识Python
Python介绍 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的脚本解释程序, 作为ABC语 ...
- chrome 安装
Centos7 yum安装chrome浏览器 跟着这个教程安装的:Centos7安装chrome浏览器 (点击) 1. 配置yum源 在目录 /etc/yum.repos.d/ 下新建文件 goo ...
- Linux 查看磁盘IO并找出占用IO读写很高的进程
背景-线上告警 线上一台服务器告警,磁盘利用率 disk.util > 90,并持续告警. 登录该服务器后通过 iostat -x 1 10 查看了相关磁盘使用信息.相关截图如下: # 如果没有 ...
- Spring-data-Jpa项目搭建
传送门:Spring Data 学习 Spring Data 开发环境搭建 Spring-data-jpa详解 简介 Spring Data是什么 Spring Data是一个用于简化数 ...
- Tomcat异常:UnsupportedClassVersionError unsupported major.minor version 51.0 unable to load class [dup
案例 今天把项目换成了jdk1.8,启动tomcat报如下异常: UnsupportedClassVersionError unsupported major.minor version 51.0 u ...