jQuery(selector,context)函数参数含义

jQuery(selector,context)函数参数含义

–回忆一下js编程环境中的对象类型，BOM对象，函数，DOM对象，能转化为falsely值的对象，普通的js对象（其中字符串对象是一个表达式，该表达式可以表示HTML标签，css选择器，正则表达式）

1.selector：可以传入以上js编程环境中存在的对象,主要是其中包含了用于匹配元素集合的 CSS 选择器，用于匹配或者创建对象，请看以下代码；

1.1、falsely值对象：undefined,null,”“;
1.2、字符串：a).HTML标签，创建DOM对象
b).css选择器
c).正则表达式
1.3、普通的js对象
1.4、BOM对象
1.5、DOM对象
1.6、函数

代码：

 <div id="name" class="foo">
        <span>1</span>
        <span class="demo">2</span>
        <span>3</span>
        <span id="current">4</span>
        <span>5</span>
    </div>
    <div>
        <span class="demo"></span>
</div>
<script>
    (function(){

    /*  1.1、selector为falsely值,返回的是一个只有一个属性指向jQuery.prototype对象的对象 */

    console.log($(""));
    console.log($(null));
    console.log($());

    /*init{__proto__: Object[0]}*/

    /* 1.2、BOM对象，返回一个jQuery形式的window对象,*/
    console.log($(window));    /* [window]*/

    /* 1.3、字符串 */
    /* 1.3.1、HTML标签,返回一个包含一个DOM对象的jQuery对象 */
    console.log($("<div>")); /* [div] */

    /* 1.3.2、css选择器,返回一个包含多个DOM对象的jQuery对象*/
    console.log($("div")); /* [div#name.foo, div, prevObject: init[1], context: document, selector: "div"]*/

    /* 1.3.3、正则表达式  */
    /* 1.4、普通js对象,返回一个包含了普通js对象的jQuery对象 */
    var object = {
        name: "obj",
    }
    console.log($(object)); /* [Object] */

    /* 1.5、DOM对象，返回一个包含该DOM对象的jQuery对象*/
    console.log($(document.getElementById("name"))); /*[div#name.foo, context: div#name.foo]*/

    /* 1.6、函数，作为文档加载完成的回调函数，*/
    $(function(){
        console.log("文档加载完毕");
    });

    /* 2.1不管是DOM还是jQuery对象，都只能是包含一个DOM元素，不然context会是undefined,上下文切换到undefined，不起作用，*/
    var divs = document.getElementsByTagName("div");

    console.log(divs);

    console.log($(".demo",$(divs)[0])); /* [span.demo, prevObject: init[1], context: div#name.foo, selector: ".demo"] */

    console.log($(".demo",divs[0])); /* [span.demo, prevObject: init[1], context: div#name.foo, selector: ".demo"]*/

    console.log($(".demo",divs)); /* [span.demo, span.demo, prevObject: init[2], context: undefined, selector: ".demo"]*/

    console.log($(".demo",$(divs))); /* [span.demo, span.demo, prevObject: init[2], context: undefined, selector: ".demo"]*/

    /* 2.3 普通js对象,对创建的对象进行扩展，以下是创建一个 <input> 元素，同时设定 type 属性、属性值，以及一些事件*/
    $("<input>", {
      type: "text",
      val: "Test",
      focusin: function() {
        $(this).val("focusin");
      },
      focusout: function() {
        $(this).val("focusout");
      }
    }).appendTo("form");
    })();
</script>

## 2.context：功能为主要用来限定第一个参数的查找范围，请看以上代码；
2.1、DOM对象
2.2、jQuery对象
2.3、普通js对象

后续会有jQuery.fn.init()函数源码的理解