JS入口函数和JQuery入口函数
首先,讲一下它们的区别:
(1)JS的window.onload事件必须要等到所有内容,以及外部图片之类的文件加载完之后,才会去执行。
(2)JQuery入口函数是在所有标签加载完之后,就会去执行。
接着,通过JS的一个覆盖问题引出对JQuery入口函数实现的解释。
JS的入口函数window.onload函数有一个覆盖的问题,当文档中出现2个window.onload函数的时候,后者会覆盖前者,导致功能实现不了。但是JQuery却没有这样的问题,重要是因为JQuery入口函数只是对封装好了的方法的一个调用,只不过传的参数不同而已。
最后,说说JQuery入口函数($(document).ready();)的实现方式。

首先,我们在script标签中我们先创建一个函数变量就叫$,然后,在后面调用。现在并没有任何效果,因为这个调用的只是一个空的对象,没有任何参数。如果我们想在$()后面继续调用,还需要做一些事情。我们看JQuery入口函数中是不是有个ready方法,那我们可以创建一个对象的属性就叫ready,然后将ready指向一个匿名的函数,现在我们就可以通过$().ready()来调用了。

我们可以用一个具体的函数测试一下:


接着,JQuery入口函数可以传一个函数(作为变量传入)进来,即$().ready(function(){}),然后用一个形参(func)变量接收,那么严执行接收的这个方法,只要调用一下(func())就行。

下面再看看JQuery入口函数前面的document参数,即$(document).ready(function(){}),这样和JQuery的入口函数就一模一样了。同样需要用一个变量接收。最后只要在ready函数里面去判断一下这个onload事件有没有(或者说有没有被赋值):
(1)有(被赋值),接收一个旧的函数,重新赋值onload事件,然后先去调用新的函数,接着再调用旧的函数,这样就不会有覆盖的问题,他俩个函数都实现了。
(2)没有,直接赋值个onload事件。

最后,我们来测试一下,由于document没有onload事件,我们可以用window来试一下。


这样就避免了函数覆盖的问题。
JS入口函数和JQuery入口函数的更多相关文章
- Jq_Ajax 操作函数跟JQuery 遍历函数跟JQuery数据操作函数
JQuery文档操作方法 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数 ...
- jquery change() 函数 语法
jquery change() 函数 语法 作用:当元素的值发生改变时,会发生 change 事件.该事件仅适用于文本域(text field),以及 textarea 和 select 元素.cha ...
- jquery blur()函数 语法
jquery blur()函数 语法 作用:当元素失去焦点时发生 blur 事件.blur() 函数触发 blur 事件,或者如果设置了 function 参数,该函数也可规定当发生 blur 事件时 ...
- Jquery核心函数
在Jquery中,所有的DOM对象都将封装成Jquery对象,而且只有Jquery对象才能使用Jquery方法或者属性来执行相应的操作. 所以Jquery提供了一个可以将DOM对象封装成Jquery对 ...
- 5.js与jQuery入口函数执行时机
js与jQuery入口函数执行时机区别: JS入口函数是在所有资源加载完成后,才执行.(包括:页面.外部js文件.外部css文件.图片) jQuery入口函数,是在文档加载完成后就执行.文档加载完成指 ...
- [jQuery]入口函数(一) jquery.min.js 一定要单线程下载,复制粘贴容易入坑
jQuery入口函数 等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完毕 $(function () { // 此处是页面DOM加载完成的入口 }); $(document).rea ...
- 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 ...
随机推荐
- D3.js v4版本 按住shift键框选节点demo
http://download.csdn.net/download/qq_25042329/10139649
- mongodb的初步使用
一.mongodb简介 MongoDB是一个基于分布式文件存储的数据库.由C++语言编写.旨在为WEB应用提供可扩展的高性能数据存储解决方案. MongoDB是一个介于关系数据库和非关系数据库之间的产 ...
- 2.4 GO Interface
package itface type Sender interface { Send(url string) string } type Geter interface { Get(url stri ...
- 转 Oracle]如何在Oracle中设置Event
https://www.cnblogs.com/gaojian/p/7619960.html 为了调查Oracle 的故障,可以通过设置event ,来了解详细的状况.方法如下: ■ 如果使用 SPF ...
- PHP冒泡排序的实现方法
<?php function BubbleSort($arr){ $count = count($arr); if($count<=1){ return $arr; } for($i=0; ...
- 个人笔记——Android网络技术
一.WebView 的用法 Android 提供WebView 的用法,可以在自己的应用程序里嵌入一个浏览器 webView.getSettings().setJavaScriptEnabled(tr ...
- 解决 下载额外数据文件失败 以下软件包要求安装后下载附加数据,但其数据无法下载或无法处理 ttf-mscorefonts-installer
ubuntu 14.04 今天安装完 wine,之后会出现这个问题 原因应该是需要的字体无法下载 那你需要手动下载, 到这个地址下载 http://sourceforge.net/projects/c ...
- Windows 10 下彻底关闭 Hyper-V 服务
由于最近需要用到VMWare Workstation 安装虚拟机,安装完成后,发现任何64位的系统都不能正常安装.可能是Hyper-V与VMWare Workstation的冲突造成的不兼容,所以就去 ...
- 数据库中char、varchar、varchar2、nvarchar之间的关系
符串“abc",对于CHAR (20),表示你存储的字符将占20个字节(包括17个空字符),而同样的VARCHAR2 (20)则只占用3个字节的长度,20只是最大值,当你存储的字符小于20时 ...
- Java集合篇六:Map中key值不可重复的测试
package com.test.collection; import java.util.HashMap; import java.util.Map; //Map中key值不可重复的测试 publi ...