find()与children()

<body>

	<ul class="level-1">

		<li class="item-i">I</li>

		<li class="item-ii">II

			<ul class="level-2">

				<li class="item-a">A</li>

				<li class="item-b">B

					<ul class="level-3">

						<li class="item-1">1</li>

						<li class="item-2">2</li>

						<li class="item-3">3</li>

					</ul>

				</li>

				<li class="item-c">C</li>

			</ul>

		</li>

		<li class="item-iii">III</li>

	</ul>

</body>

find

$(".level-2").find("li").css("border", "1px solid red");

结果：

children

$(".level-2").children().css("border", "1px solid red");

结果

结论：

两者都是用来寻找当前结点的后代元素，但children找的是直系（只向下找一级），find找的是所有的子孙后代；用法上，chilren不用跟参数，find则必须跟参数。

绑定与解绑事件

bind()

用法：

bind(eventType [, eventData ], handler)

handler是绑定到当前选中的元素，所以这些元素在调用bind之前必须存在。

自jQuery3.0开始，已不建议使用

<body>

	<p>Click or double click here.</p>

	<span></span>

</body>


$("p").bind("click", function (event) {

    var str = "( " + event.pageX + ", " + event.pageY + " )";

    $("span").text("Click happened! " + str);

});

对于动态增加的元素，之前通过bind绑定的事件对它不起作用。例如：

$("body").append("<p>新增</p>");

live

用法：

live(events, handler)

描述：

Attach an event handler for all elements which match the current selector, now and in the future.

自jQuery1.7开始，已不建议使用

小结论：bind和live一次只能绑定一个事件，且都已不被建议使用。

delegate

用法：

delegate(selector, eventType, handler)

描述：

Attach a handler to one or more events for all elements that match the selector, now or in the future, based on a specific set of root elements.

自jQuery3.0开始，已不建议使用

<body>

	<p>Click me!</p>

</body>


$("body").delegate("p", "click", function () {

    $(this).after("<p>Another paragraph!</p>");

});

结果：点击p都会产生新的"Another paragraph!"，而对新产生的p标签点击之后也绑定了click事件。

点击原有的p标签



点击新生的p标签

on

用法：

on(events [, selector ] [, data ], handler)

描述：

Attach an event handler function for one or more events to the selected elements.

<body>

	<p>click me</p>

</body>


$("p").on("click select", function () {

    alert("attention");

});

$("body").append("<p>new one</p>");

结果



结论

函数名 可绑定的事件数 能对后添加元素绑定事件 jQuery建议版本
bind 1 不能 <=3.0
live 1 能 <=1.7
delegate 多 能 <=3.0
on 多 不能 now

对应的解绑函数分别为 unbind() die() undelegate() off()

jQuery中易混淆知识点总结（持续更新）的更多相关文章

  1. js中一些小知识点总结--持续更新

    以下知识点来自于编写高质量代码-改善JavaScript程序的188个建议,只用于自我知识的补充. 一.NaN 1.NaN是一个特殊的数量值,不表示一个数字,尽管下面的代码仍然是返回类型为number ...

  2. JQuery中易混淆的概念

    append(): 向每个匹配的元素内部追加内容. <p>I would like to say: </p> $("p").append("< ...

  3. C#中易混淆的知识点

    C#中易混淆的知识点 一.引言 今天在论坛中看到一位朋友提出这样的一个问题,问题大致(问题的链接为:http://social.msdn.microsoft.com/Forums/zh-CN/52e6 ...

  4. Java-web易混淆知识点整理

    Java-web易混淆知识点 post和get区别 post: 数据不会显示在地址栏 安全 大小无限制 可以提交二进制文件 get: 数据显示在地址栏 不安全 get方式提交有大小限制(约4kb) 相 ...

  5. lua中易混淆函数

    lua中易混淆的函数 ipairs和pairs: ipairs只能顺序遍历table,遇到key不是数字就会退出 pairs可以遍历table中所有元素 ----------------------- ...

  6. JavaScript中易混淆的DOM属性及方法对比

    JavaScript中易混淆的DOM属性及方法对比 ParentNode.children VS Node.prototype.childNodes ParentNode.children:该属性继承 ...

  7. PHP 日常开发过程中的bug集合（持续更新中。。。）

    PHP 日常开发过程中的bug集合(持续更新中...) 在日常php开发过程中,会遇到一些意想不到的bug,所以想着把这些bug记录下来,以免再犯! 1.字符串 '0.00'.'0.0'.'0'  是 ...

  8. C#、Java中的一些小知识点总结(持续更新......)

    前言:在项目中,有时候一些小的知识,总是容易让人忽略,但是这些功能加在项目中往往十分的有用,因此笔者在这里总结项目中遇到的一些实用的小知识点,以备用,并持续更新...... 1.禁用DataGridV ...

  9. C# 知识点记录(持续更新中）

    从看C#入门经典开始系统的学习C#,本文主要记录学习过程中的一些知识点,也是我博客生涯的开始,比较重要成体系的部分会单重新写文章整理归纳. 1.一字不变的字符串 @字符 使转义序列不被处理,按照原样输 ...

随机推荐

  1. 第1课 - 学习Lua的意义

    学习Lua的意义 1.Lua简介             (1) 1993年.巴西 (2) 小巧精致的脚本语言,大小只有200K (3) 用标准C语言写成,能够在所有的平台上编译运行 (4) 发明的目 ...

  2. 30分钟掌握 C#7

    1. out 变量(out variables) 以前我们使用out变量必须在使用前进行声明,C# 7.0 给我们提供了一种更简洁的语法 "使用时进行内联声明" .如下所示: va ...

  3. Java转型（向上转型和向下转型）

    在Java编程中经常碰到类型转换,对象类型转换主要包括向上转型和向下转型. 5.13.1 向上转型 我们在现实中常常这样说:这个人会唱歌.在这里,我们并不关心这个人是黑人还是白人,是成人还是小孩,也就 ...

  4. 循环神经网络RNN公式推导走读

    0语言模型-N-Gram 语言模型就是给定句子前面部分,预测后面缺失部分 eg．我昨天上学迟到了,老师批评了____. N-Gram模型: ,对一句话切词 我 昨天 上学 迟到 了 ,老师 批评 了 ...

  5. Python的内置函数open()的注意事项

    用法 : open("file_address","open_mode")例子 : f = open("D:\PycharmProjects\log. ...

  6. Lambda表达式随笔

    1.Lambda表达式是一个匿名函数,其本质其实还是一个函数,因此任何一个Lambda表达式都可以以其它的方式通过普通的函数实现或者代替. 2.Lambda表达式云算符:=>,该运算符读为&qu ...

  7. 简谈-如何使用Python和R组合完成任务

    概述 和那些数据科学比赛不同,在真实的数据科学中,我们可能更多的时间不是在做算法的开发,而是对需求的定义和数据的治理.所以,如何更好的结合现实业务,让数据真正产生价值成了一个更有意义的话题. 数据科学 ...

  8. DirectFB 之 通过多Window实现多元素处理

    图像 设计 采用多window的方式实现显示,因为每个window可以独立的属性,比如刷新频率,也是我们最关注的 示例 /*************************************** ...

  9. Attribute注解

    class Program { static void Main(string[] args) { //Attribute注解,Attribute是附加到方法.属性.类等上面的特殊的标签,在类Type ...

  10. arcgis for javascript 之 clone()问题小计

    情景再现:      用户点击一个featurelayer的图斑,(属性信息从mysql中获取),同时高亮此地块,点击一下个地块时候,取消高亮.(请忽略跨域造成的图标错误,jetty试了好久不能跨域· ...