zoukankan      html  css  js  c++  java
  • jQuery知识

    1.jquery对外暴露了两个变量,$和jQuery,这两变量指向同一个函数。

    // 不传参数可以创建jQ对象
    console.log($());//===>jquery.fn.init {}

    // 传参得到的也是jQ对象
    console.log($('body'));//===>[body, prevObject: jQuery.fn.init[1]]

    // 传入任何不同的参数,jQ会做不同的处理,但是都会得到jQ对象
    console.log($(function(){//===>[document]
    console.log(1);
    }));

    // 发现jQ实例对象会以下标的形式存储数据(大部分情况下都是DOM元素),
    // 并且还有一个length属性
    // 说明jQ实例对象是一个伪数组。
    console.log($('span'));//===>[span, span, span, prevObject: jQuery.fn.init[1]]

    // jQ实例能够像数组一样访问里面存储的数据和数据量
    console.log($('span')[0]);//===>
    console.log($('span').length);//===>3

    2.jQuery结构作用:

    /*
    * 1、工厂函数有什么用?
    * 把创建对象的过程进行封装,用户只需调用工厂就可以得到相应的实例,
    * 咱们这里最大的好处就是创建对象的时候省去了new关键字。
    *
    * 2、init为什么是一个构造函数呢?
    * 因为工厂函数new的是init,所以init是构造函数。
    *
    * 3、为什么不能把工厂函数和构造函数融为一体,即工厂内部new自己:
    * new 自己就是死循环。
    *
    * 4、为什么要把init加到原型中:
    * 猜想,对外暴露的是jQuery工厂函数,可以通过工厂创建实例,
    * 但是实例.constructor的值是工厂,为了能够通过实例得到构造函数,
    * 所以也把构造函数加到了原型中,这样实例.init就找到了它的构造函数。
    *
    * 5、为什么要给工厂加一个fn属性呢?
    * 为了用户书写方便,相比prototype省去了不少字符,再一次解放了用户的双手。
    *
    * 6、为什么要把构造的原型置换为工厂的原型?
    * 因为对外暴露的是工厂函数,jQ在工厂的身上加了一个插件机制,
    * 通过$.fn.extend()给工厂的原型进行扩展,但是如何让init实例能够使用工厂原型中的方法呢,
    * 解决方案就是把init的原型置换为工厂的原型。
    * */

    3.jquery入口函数对不同参数的处理:

    /*
    * 0、传入函数
    * 当页面中的DOM构造完毕后,会被执行
    *
    * 1、undefined、null、NaN、0、''
    * 返回空实例
    *
    * 2、对字符串处理
    * 2.1 如果传入的是html字符串,那么创建对应的元素,存储到实例身上然后返回
    * 2.2 如果传入的是其他字符串,那么统一当做是选择器获取页面中的元素,存储到实例身上然后返回
    *
    * 3、传入1个DOM元素
    * 传入1个DOM元素,把这个DOM存储到实例身上返回
    *
    * 4、传入1组DOM元素(伪数组)
    * 把伪数组中所有的DOM元素存储到新实例返回
    *
    * 5、传入jQ实例对象(伪数组)
    * 传入jQ实例,因为JQ实例本身就是伪数组,同样把伪数组中所有的DOM元素存储到新实例返回
    * 6、传入一个真数组
    * 把数组中所有的数据存储到新实例返回
    * 7、传入一个自定义的伪数组对象
    * 把伪数组中所有的数据存储到新实例返回
    *
    * 8、传入1个其他的数据类型
    * 把这个数据存储到新实例身上,然后返回
    * */

  • 相关阅读:
    Java基础——面向对象(继承应用)
    Java基础——数组例题&二维数组
    Java基础——面对对象-继承
    Java基础——this构造器转发 & 实例块、静态块
    spring mvc 映射与适配器
    Spring component-scan 标签的实现
    DUBBO 服务导出实现
    Idea
    ReentrantLock 实现
    C 语言程序设计
  • 原文地址:https://www.cnblogs.com/luxiaoxiao/p/6099102.html
Copyright © 2011-2022 走看看