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 一定要单线程下载,复制粘贴容易入坑的更多相关文章

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

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

  2. 5.js与jQuery入口函数执行时机

    js与jQuery入口函数执行时机区别: JS入口函数是在所有资源加载完成后,才执行.(包括:页面.外部js文件.外部css文件.图片) jQuery入口函数,是在文档加载完成后就执行.文档加载完成指 ...

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

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

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

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

  5. 1.jQuery入口函数

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

  6. 第69天：jQuery入口函数

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

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

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

  8. jQuery——入口函数

    中文网 http://www.css88.com/jqapi-1.9/ 版本兼容问题 版本一:1.x版本,兼容IE678 版本二:2.x版本,不兼容IE678 入口函数区别 <script> ...

  9. jquery 入口函数

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

随机推荐

  1. Python第一个请求接口

    1.普通get请求 import requests import json login_res=requests.post(url='http://joy.web.com:8090/login',da ...

  2. 13.系统总结static

    static修饰属性和方法: package com.oop.demo08; //static :被static修饰的变量或者方法随类加载,从属于类,当然对象也可以调用 public class St ...

  3. 不要把 JWT 用作 session

    现在很多人使用 JWT 用作 session 管理,这是个糟糕的做法,下面阐述原因,有不同意见的同学欢迎讨论. 首先说明一下,JWT 有两种: 无状态的 JWT,token 中包含 session 数 ...

  4. 异数OS谈发展国产操作系统的问题

    异数OS谈发展国产操作系统的问题 为什么写本文 最近中兴被美制裁的问题以及红芯使用开源技术宣称国产自主技术引发了舆论不少对国产CPU以及国产操作系统自主技术的讨论,为什么我们国家有BAT,有原子弹,能 ...

  5. 【Java并发基础】使用“等待—通知”机制优化死锁中占用且等待解决方案

    前言 在前篇介绍死锁的文章中,我们破坏等待占用且等待条件时,用了一个死循环来获取两个账本对象. // 一次性申请转出账户和转入账户,直到成功 while(!actr.apply(this, targe ...

  6. ElEmentUI选择器弹出框定位错乱问题解决(弹出框出现在左上角)

    这个是原问题,我之前是没问题的,后来的突然出现了这个问题,查了好多没找到,后来看文档才发现的.通过这个问题,说明看文档的重要性,嘻嘻 解决办法是在选择器里插入一个 :popper-append-to- ...

  7. MNIST数据集

    一.MNIST数据集分类简单版本 import tensorflow as tffrom tensorflow.examples.tutorials.mnist import input_data # ...

  8. Add Scaffold

  9. Creating Custom Helper Methods 创建自定义辅助器方法----辅助器方法 ------ 精通ASP.NET MVC 5

    创建内联的辅助器方法 和 拓展方法 好像类似的功能. 不过写在前台更直观

  10. laravel脚手架搭建项目问题之生产环境element-ui组件字体图标显示错误问题

    问题描述: 1.element-ui组件使用的是npm安装 2.npm scripe模式开发 3.使用git命令行工具开发 3.开发环境下图标正常显示 4.生产环境下图标显示不正常 分析原因: 图标文 ...