<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title></title>

    <style type="text/css">

        .red {

            color: red;

        }

    </style>

</head>

<body>

    <div class="red">1</div>

    <div>2</div>

    <div>3</div>

</body>

    <script language="javascript" type="text/javascript">

        var $ = jQuery = function( selector, context ){    //定义类

            return new jQuery.fn.init(selector, context);    //返回选择器的实例

        }

        //jQuery类的原型对象

        jQuery.fn = jQuery.prototype = {

            init : function(selector, context){                //定义选择器构造器

                selector = selector || document;    //设置默认值为document

                context = context || document;         //设置默认值为document

                if( selector.nodeType ) {        //如果选择符为节点对象

                    this[0] = selector;            //把参数节点传递给实例对象的数组

                    this.length = 1;            //并设置实例对象的length属性，定义包含的元素个数

                    this.context = selector;    //设置实例的属性，返回选择范围

                    return this;        //返回当前实例

                }

                if( typeof selector === "string" ) {    //如果选择符是字符串

                    var e = context.getElementsByTagName(selector);

                    //获取指定名称的元素

                    for( var i = 0; i < e.length; i++ ){//遍历元素集合，并把所有元素填入到当前实例数组中

                        this[i] = e[i];

                    }

                    this.length = e.length; //设置实例的length属性，即定义包含的元素个数

                    this.context = context; //设置实例的属性，返回选择范围

                    return this; //返回当前实例

                } else {

                    this.length = 0; //否则，设置实例的length属性值为0

                    this.context = context;

                    return this; //返回当前实例

                }

            },

            jquery: "1.3.2",     //原型属性

            size: function() {    //原型方法

                return this.length;

            }

        }

        jQuery.fn.init.prototype = jQuery.fn;    //使用jQuery的原型对象覆盖init的原型对象

        alert( $("div").size() );    //返回3

    </script>

</html>

模仿jquery框架源码 -成熟---选择器的更多相关文章

  1. 模仿jquery框架源码

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  2. 模仿jquery框架源码 -生长---跨域访问

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  3. 模仿jquery框架源码---网络

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Page& ...

  4. jQuery框架源码解读

    1.jQuery 1.9.1 parseJSON: function( data ) { // Attempt to parse using the native JSON parser first ...

  5. 【学】jQuery的源码思路1——后代选择器

    jQuery的源码思路1--后代选择器 这里探讨一下jQuery中后代选择器的封装原理,并自己写一下 getEle('#div1 ul li .box');接受的参数就是个后代选择器,类似于这样: # ...

  6. 【深入浅出jQuery】源码浅析--整体架构

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

  7. 【深入浅出jQuery】源码浅析2--奇技淫巧

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

  8. YII框架源码分析(百度PHP大牛创作-原版-无广告无水印)

           YII 框架源码分析    百度联盟事业部——黄银锋 目 录 1. 引言 3 1.1.Yii 简介 3 1.2.本文内容与结构 3 2.组件化与模块化 4 2.1.框架加载和运行流程 4 ...

  9. 【深入浅出jQuery】源码浅析2--使用技巧

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

随机推荐

  1. rsync详解之exclude排除文件（转）

    rsync详解之exclude排除文件 问题:如何避开同步指定的文件夹?  --excludersync  --exclude files and folders http://articles.sl ...

  2. 10分钟-jQuery-基础选择器

    1.id 选择器 jquery能使用CSS选择器来操作网页中的标签元素.假设你想要通过一个id号去查找一个元素,就能够使用例如以下格式的选择器: $("#my_id") 当中#my ...

  3. 【BIEE】03_BIEE数据源配置

    声明:此时说的是Oracle数据源配置 BIEE数据源配置有两种方法 ①直接使用字符串连接 ②将tnsnames.ora文件覆盖到obiee目录下 直接使用字符串 直接使用字符串连接很简单 首先打开资 ...

  4. AOP切面编程在android上的应用

    代码地址如下:http://www.demodashi.com/demo/12563.html 前言 切面编程一直是一个热点的话题,这篇文章讲讲一个第三方aop库在android上的应用.第三方AOP ...

  5. 基于JWT的Token开发案例

    代码地址如下:http://www.demodashi.com/demo/12531.html 0.准备工作 0-1运行环境 jdk1.8 maven 一个能支持以上两者的代码编辑器,作者使用的是ID ...

  6. mongoDB DOS窗口显示中文

    http://zhidao.baidu.com/question/157276582 由于mongodb后台的字符编码都是utf-8的,而中文windows cmd窗口使用的字符编码是GBK(属性-& ...

  7. Android下的Handler

    coder是没必要重复造轮子的,写博客亦如此.因为工作忙,学的东西比较多,没法自己来写博客.自己想了个思路就是,把别人的技术精华拿过来,从简到难,慢慢学习.最后提炼,得到自己想学的东西即可,等有时间了 ...

  8. SQLServer 2017安装时的错误：Polybase要求安装Oracle JRE 7更新51或更高版本

    2016应该也有这个问题 下载JDK7就可以了(我装10是不可以解决的) 重新运行下 安装完后再安装SSMS 附: MS SQL SERVER 2017全套下载地址(含JDK7.SSMS.KEY): ...

  9. is_callable — 检测参数是否为合法的可调用结构

    说明 bool is_callable ( callable $name [, bool $syntax_only = false [, string &$callable_name ]] ) ...

  10. java web 通配符* ? $1 $2 $3

    匹配通配符 * 匹配0-n个字符,但不包括“/”.即,“*”只匹配一级目录或文件中的零个或多个字符. ** 匹配0-n个字符,包括“/”.即,“**”匹配多级目录或文件. ? 匹配0-1个字符,但不包 ...