`
roccloudy
  • 浏览: 662 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

jquery是怎样开始工作(2)

阅读更多

       接着上节写.我们在工作中使用jquery的时候常常是这样开始的:

 

$(document).ready(function(){});

       这样写的目的是让文档先加载,然后再开始执行ready.这和调用window.onload方法差不多,当然ready有些好处,比如速度快,会执行多个,不再赘述.我要说的是,它有个简写的方法:

$(function(){});

      其实我人生中写的第一段jquery代码就是这样开头的,当时也没有太多的理解,最近看源码,才知道为什么可以这样写,源码大意如下,中间略去N多代码:

 

 

var rootjQuey = JQuery(docuemt);
rootJQuery.ready = function(){
  //具体实现很复杂以后再说
}
// 这是我上节写的初始化函数
init(selector){
     if(typeof selector == "function"){
             return rootjQuery.ready( selector ) ;
      }
}

    所以$(function())实际是调用init(function()),那么返回的就是rootjQuery.ready(function()),也就是JQuery(doucment).ready(function()),即$(document).ready(function());

 

    我这两节写的初始化函数都是init,而真正的源码的初始化函数是:

 

var JQuery = function(selector, context){
      reutrn new JQuery.fn.init(selector, context);
}

// 通过初始化函数构建JQuery对象
var init = JQuery.fn.init = function(selector, context){
      // N多代码...
}

    其中JQuery.fn = JQuery.prototype,也就是JQuery函数的原型对象,而我自己定义的是:

var MyJquery = function(selector){  
  
        // 把selector参数传入init中让它去初始化  
        return new init(selector);  
    };  
  
    // 初始化函数,它负责处理传入的参数  
    var init = function(selector){  
        alert("传入的参数是"+selector);  
    }  

    参数context先不说,源码比我多了个JQuery.fn.init();也就是把init()函数定义在了JQuery.fn(JQuery原型对象)上,这样做的好处是可以节省空间. 简单的理解就是:

    直接定义init(),每个实例对象都会有一个init()方法.

    通过原型对象定义init(),每个实例对象共享一个init()方法.

    具体关于对象原型相关的知识,推荐<<javascript高级程序设计>>(我看的是第三版第六章面向对象的程序设计)

 

 

 

 

 

 

 

分享到:
评论

相关推荐

    从零开始学习JQuery

    从零开始学习jQuery (一) 开天辟地入门篇 从零开始学习jQuery (二) 万能的选择器 从零开始学习jQuery (三) 管理jQuery包装集 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 从零开始学习jQuery (五) ...

    深入PHP与jQuery开发 pdf格式

    你也将学到jQuery的基本工作原理,包括它如何在项目中应用,以及它的内核(强大的选择器引擎)如何工作。 1.1 为什么选择jQuery 在Web应用中,JavaScript以难以驾驭闻名。浏览器兼容性差、难以调试,又有着使人...

    jQuery EasyUI 1.4 离线简体中文API文档

    jQuery EasyUI 1 4版本更新内容: Bug(修复) menu:修复在删除一个菜单项的时候该菜单无法正确自适应高度的问题; datagrid:修复在datagrid宽度太小的时候“fitColumns”方法无法正常工作的问题 Improvement...

    《精通Javascript+jQuery》光盘源码

     1.3.4 新的开始  1.4 Web标准  1.4.1 Web标准概述  1.4.2 结构.c表现和行为的分离  第2章ccJavaScript基础  2.1 JavaScript的语法  2.2 变量  2.3 数据类型  2.3.1 字符串  2.3.2 数值  2.3.3 ...

    Jquery 技术详解

    使用 jQuery 简化 Ajax 开发(转载) jQuery 是什么? jQuery 由 John Resig 创建于 2006 年初,对于任何使用 ...当您理解并体会这一原理后,便可以开始学习本教程了,看看 jQuery 对我们的编程方式有多少改进吧。

    jquery-ui-1.12.1(js + css)

    jQuery UI提供交互,效果,小部件,实用程序和主题的组合,这些主题旨在一起工作或者自己一起工作。播放演示,查看源代码,构建主题,阅读 API文档,并开始使用jQuery UI。

    jQuery JavaScript与CSS开发入门经典

    JQuery堪称动态Web应用程序领域的编程利器,可帮助您利用更少代码完成更多工作,同时减少错误数量。jQuery将JavaScript编程量精简为寥寥数行代码,使JavaScript变得更直观,更富魅力。iQuery还允许同时为一个或多个...

    深入分析jQuery的ready函数是如何工作的(工作原理)

    本文深入分析jQuery的ready函数是如何工作的。分享给大家供大家参考,具体如下: jQuery 是一个伟大的脚本库,由 John Resig 在 2006年1月的BarCamp NYC上释出第一个版本。你可以在 http://jquery.com/ 下载到最新...

    jquery-plugin-template:用于创建jQuery插件的模板。 基于jQuery-boilerplate,内置测试开始

    jQuery插件模板 一个基于jQuery插件模板和George Paterson的的测试配置。 用法 包括jQuery: &lt; script src =" http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js " &gt; &lt;/ script &gt; ...

    jQuery Mobile 简介

    在开始学习 jQuery Mobile 前, 你应该了解一下基础知识: HTML CSS jQuery 如果你想学习这些知识,你可以访问本站的首页。 什么是 jQuery Mobile? jQuery Mobile 是针对触屏智能手机与平板电脑的网页开发框架。 ...

    翻译jQuery1.4官方文档API

    早在jquery1.4还没有上线前,对于他的的新版本已经是沸沸扬扬了,国外的追逐者早已经从测试版就开始追,翻译jQuery1.4官方文档API,为了庆祝jQuery的四周岁生日, jQuery的团队荣幸的发布了jQuery Javascript库的最新...

    jQuery EasyUI 1.4 离线简体中文API文档 含完整开发工具包+皮肤+扩展+演示

    (题外话:从本次开始 我新增了jQuery EasyUI的专题页面 大家可以关注我的专题页来及时获取最新的EasyUI资源 专题页地址如下http:http://download.csdn.net/album/detail/343 同时也希望转载的那些朋友能保留我资源...

    jQuery模仿单选按钮选中效果

    刚开始学jquery,工作中有些css表单中的按钮美化很麻烦,所以想着用jquery来替换,复选框的jquery很容易,就是简单的样式切换效果,用toggleClass()方法即可。 而单选框之前一直不知道怎么做,因为在单选框中选中一...

    jQuery模仿ExtJS之TabPanel最新

    下标以0为开始,默认为0。 maxLength&lt;number&gt; 最多显示几个选项卡元素 -1为无限,默认为-1。 tabs&lt;return array&gt; 获得选项卡组件所有的选项卡元素 可根据需要获得选项卡组件的所有选项卡元素。 公共方法 addTab...

    从零开始学习jQuery (二) 万能的选择器

    编写任何javascript程序我们要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如”拥有title属性并且值中包含test的元素”, 完成这些工作只需要编写一个jQuery选择器...

    轻松实现jquery选项卡切换效果

    很早之想就学习jquery的插件写法,一直拖到现在,今天趁着没什么工作忙,搜索些资料学习下,写了个比较简单的选项卡效果。 刚开始有看到一个很通俗易通的例子:alert对话框。 jquery.alertMsg.js /** * ...

    form-checker:jQuery插件,可帮助在提交之前检查表单值

    jQuery formChecker Plugin是一个表单验证的插件,来源于实际的项目,实现上参考了工作中用到的后端验证。 快速开始 引入jQuery,1.4版本以上。 引入jquery.formChecker.js。 对要验证的表单元素使用formChecker,...

    jQuery 3.0十大新特性

    jQuery 3.0在日前发布了最终的全新版本。从2014年10月,jQuery团队对这个主要大版本进行维护开始,web开发者社区便一直在期待着这一刻的...如果你想要测试一下你的项目如何在jQuery 3.0中工作的,你可以尝试通过jQuery

    功能强大的jquery.validate表单验证插件

    2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确、错误提示及鼠标移入时的帮助提醒 对于初学者而言,html表单验证是一项极其琐碎的事情。要做好表单验证,需要准备以下基本要素:  1).html表单结构:...

Global site tag (gtag.js) - Google Analytics