一:$(selectorStr[,限制范围]),接受一个选择器(符合jQuery规范的字符串),返回一个jQuery对象;
二:$(htmlStr[,文档对象]),$(html[,json对象])传入html字符串,创建一个新的dom元素
三:$(dom元素),$(dom元素集合)将dom元素转换成jQuery对象.
四:$(自定义对象)封装普通对象为jQuery对象.
五:$(回调函数)绑定ready事件监听函数,当Dom加载完成时执行.
六:$(jQuery对象)接受一个jQuery对象,返回一个jQuery对象的拷贝副本
七:$()创建一个空jQuery对象.

 //$(selector[,限制范围])
$(".guo").click(function () {//这里没有context参数
$("a.aguo", this).css({"color":"red"});//this就是context参数,用于限定范围
});

当传入的是字符串的时候,构造函数会判断是选择器字符串还是html字符串.,
如果是选择器字符串:则遍历dom,查找与之匹配的元素,如果没有匹配元素,
会返回一个空的jQuery对象;否则会将这些匹配到的元素创建一个对一个jQuery对象.

 //$(htmlStr[,文档对象])
$("<div>大家好</div>").append("body"); //简单标签:不带子节点

jQuery构造函数会使用js的原生态方法document.createElement()创建一个dom节点

 $("<div><a>大家好</a></div>").append("body"); //复杂标签:含有子节点.

jQuery会使用文档碎片buildFragment()的方法将所有子节点一次性的全部插入到[,文档对象]中,
如果这里不指定的话,就是document;

$(html[,json对象])

当html是简单标签时,那么她的第二个参数可以是一个json对象,包含了这个dom元素的属性或事件.

 //$(html[,json对象])
$("<div></div>", {
"class": "gys", //因为class是js的关键字,所以要加引号
text: "大家好",
click: function () { alert("点我干嘛"); }
}).append("body");

$(element)或者$(elements)

传入一个dom对象或者一组dom对象集合

 ("div.guo").click(function () {
$(this).slideUp();
});

$(object);

传入一个普通的对象

        var obj = { name: "guo", age: 24 };
var $obj = $(obj);
$obj.on("guo", function () {
alert("出发了一个自定义的事件");
});
$obj.trigger("guo");

$(callback)传入一个函数

 $(function () { })

这个表示在Dom加载完毕后执行函数中的.

$(jQuery Object);

传入一个jQuery对象,则创建该jQuery对象的一个副本并返回,副本与传入的jQuery对象引用完全相同的Dom对象.

二.jQuery源码解析之构建jQuery之构建函数jQuery的7种用法的更多相关文章

  1. jQuery 源码解析二:jQuery.fn.extend=jQuery.extend 方法探究

    终于动笔开始 jQuery 源码解析第二篇,写文章还真是有难度,要把自已懂的表述清楚,要让别人听懂真的不是一见易事. 在 jQuery 源码解析一:jQuery 类库整体架构设计解析 一文,大致描述了 ...

  2. JQuery源码解析(一)

    写在前面:本<JQuery源码解析>系列是基于一些前辈们的文章进行进一步的分析.细化.修改而写出来的,在这边感谢那些慷慨提供科普文档的技术大拿们. 要查阅JQ的源文件请下载开发版的JQ.j ...

  3. jquery源码解析:jQuery数据缓存机制详解2

    上一课主要讲了jQuery中的缓存机制Data构造方法的源码解析,这一课主要讲jQuery是如何利用Data对象实现有关缓存机制的静态方法和实例方法的.我们接下来,来看这几个静态方法和实例方法的源码解 ...

  4. jquery源码解析:代码结构分析

    本系列是针对jquery2.0.3版本进行的讲解.此版本不支持IE8及以下版本. (function(){ (21, 94)     定义了一些变量和函数,   jQuery = function() ...

  5. jquery 源码解析

    静态与实力方法共享设计 遍历方法 $(".a").each() //作为实例方法存在 $.each() //作为静态方法存在 Jquery源码 jQuery.prototype = ...

  6. jQuery源码解析资源便签

    最近开始解读jQuery源码,下面的链接都是搜过来的,当然妙味课堂 有相关的一系列视频,长达100多期,就像一只蜗牛慢慢爬, 至少品读三个框架,以后可以打打怪,自己造造轮子. 完全理解jQuery源代 ...

  7. 三.jQuery源码解析之jQuery的框架图

    这张图片是对jQuery源码截图,一点一点拼出来的. 现在根据这张图片来对jQuery框架做一些说明. 一.16~9404行可以发现,最外层是一个自调用函数.当jQuery初始化时,这个自调用函数包含 ...

  8. jQuery 源码解析一:jQuery 类库整体架构设计解析

    如果是做 web 的话,相信都要对 Dom 进行增删查改,那大家都或多或少接触到过 jQuery 类库,其最大特色就是强大的选择器,让开发者脱离原生 JS 一大堆 getElementById.get ...

  9. 一.jQuery源码解析之总体架构

    (function (window, undefined) { //构建jQuery对象 var document = window.document, navigator = window.navi ...

  10. jquery源码解析:addClass,toggleClass,hasClass详解

    这一课,我们将继续讲解jQuery对元素属性操作的方法. 首先,我们先看一下这几个方法是如何使用的: $("#div1").addClass("box1 box2&quo ...

随机推荐

  1. 【C#笔札】Tryparse的用法

    这是参考读物的上得一个例子.自己仿照做的作业 private void button1_Click(object sender, EventArgs e) { int P_int_Number,i; ...

  2. HDU - 4804 Campus Design 轮廓线dp

    题意:一个nm的矩阵被12的骨牌和11的骨牌完全覆盖,11的骨牌只能放c-d次,矩阵中有障碍物 题解:dp[i][j][k]表示到了第i行,第j个状态,放过k个11的骨牌,当前位有障碍物时只有一种转移 ...

  3. hdu1847sg函数

    刚开始因为没注意到f是从0开始的导致wa了几次,f遍历的时候从0到f[j]<=i 这个题只有一个子情况,求出sg值直接判断就好了 #include<map> #include< ...

  4. codeforce——因数筛

    题目大意:给你一个 n 和 k 求 n 的第 k 个因数. #include<iostream> #include <algorithm> #include <queue ...

  5. module.exports和exports

    require 用来加载代码,而 exports 和 module.exports 则用来导出代码.但很多新手可能会迷惑于 exports 和 module.exports 的区别,为了更好的理解 e ...

  6. translate函数

    translate函数: select translate('ab23cd1', '.0123456789' || 'ab23cd1', '.0123456789') from dual 截图:

  7. 使用java.net.URLConnection发送http请求

    首先,这个需要一点HTTP基础,可以先看个书了解下,我看的<http权威指南>的前4章,后面道行不够看不下去. 然后我们的是java.net的接口: 几个类的API: package co ...

  8. jQuery - 左右拖动分隔条

    1.实现效果: 2.代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http ...

  9. 搭建开发环境(React Native)

    来源:http://reactnative.cn/docs/0.31/getting-started.html 在GitHub上修改这篇文档 欢迎使用React Native!这篇文档会帮助你搭建基本 ...

  10. 故障处理:磁盘扩容出错:e2fsck: Bad magic number in super-block while trying to open /dev/vdb1

    按照阿里云官网教程对云服务器进行磁盘扩容,使用fdisk重新分区,最后使用e2fsck和resize2fs来完成文件系统层面的扩容 在执行“e2fsck -f /dev/vdb1”命令时报错,如果你的 ...