jQuery中易混淆知识点总结(持续更新)
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中易混淆知识点总结(持续更新)的更多相关文章
- js中一些小知识点总结--持续更新
以下知识点来自于编写高质量代码-改善JavaScript程序的188个建议,只用于自我知识的补充. 一.NaN 1.NaN是一个特殊的数量值,不表示一个数字,尽管下面的代码仍然是返回类型为number ...
- JQuery中易混淆的概念
append(): 向每个匹配的元素内部追加内容. <p>I would like to say: </p> $("p").append("< ...
- C#中易混淆的知识点
C#中易混淆的知识点 一.引言 今天在论坛中看到一位朋友提出这样的一个问题,问题大致(问题的链接为:http://social.msdn.microsoft.com/Forums/zh-CN/52e6 ...
- Java-web易混淆知识点整理
Java-web易混淆知识点 post和get区别 post: 数据不会显示在地址栏 安全 大小无限制 可以提交二进制文件 get: 数据显示在地址栏 不安全 get方式提交有大小限制(约4kb) 相 ...
- lua中易混淆函数
lua中易混淆的函数 ipairs和pairs: ipairs只能顺序遍历table,遇到key不是数字就会退出 pairs可以遍历table中所有元素 ----------------------- ...
- JavaScript中易混淆的DOM属性及方法对比
JavaScript中易混淆的DOM属性及方法对比 ParentNode.children VS Node.prototype.childNodes ParentNode.children:该属性继承 ...
- PHP 日常开发过程中的bug集合(持续更新中。。。)
PHP 日常开发过程中的bug集合(持续更新中...) 在日常php开发过程中,会遇到一些意想不到的bug,所以想着把这些bug记录下来,以免再犯! 1.字符串 '0.00'.'0.0'.'0' 是 ...
- C#、Java中的一些小知识点总结(持续更新......)
前言:在项目中,有时候一些小的知识,总是容易让人忽略,但是这些功能加在项目中往往十分的有用,因此笔者在这里总结项目中遇到的一些实用的小知识点,以备用,并持续更新...... 1.禁用DataGridV ...
- C# 知识点记录(持续更新中)
从看C#入门经典开始系统的学习C#,本文主要记录学习过程中的一些知识点,也是我博客生涯的开始,比较重要成体系的部分会单重新写文章整理归纳. 1.一字不变的字符串 @字符 使转义序列不被处理,按照原样输 ...
随机推荐
- 以正确的姿势实现一棵JavaScript菜单树
菜单树是常见的前端特效, 一般长下面这样 还有各种形态的变种, 有长这样的 也有长这样的 尽管这些菜单的相貌都不尽相同, 在功能实现的本质上却都是相同的.实现程序的大致流程如下 读取服务器端的菜单数据 ...
- Eclipse中Maven插件部分常用功能命令介绍
原创作品,可以转载,但是请标注出处地址:http://www.cnblogs.com/V1haoge/p/6689010.html Eclipse中安装Maven插件之后,就能很方便的管理Maven项 ...
- [UWP]了解模板化控件(4):TemplatePart
1. TemplatePart TemplatePart(部件)是指ControlTemplate中的命名元素.控件逻辑预期这些部分存在于ControlTemplate中,并且使用protected ...
- 转账示例(三):service层面实现(线程管理Connection)(本例采用QueryRunner来执行sql语句,数据源为C3P0)
缺点:Service层面还是不应该出现关于事务的操作1.自行创建C3P0Uti,account数据库,导入Jar包 2.Dao层面 接口: package com.learning.dao; impo ...
- 一条SQL搞定信息增益的计算
欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 周东谕,2011年加入腾讯,现任职于腾讯互娱运营部数据中心,主要从事游戏相关的数据分析和挖掘工作. 信息增益原 ...
- 使用Spring标签<form:textarea>时,用readonly=“readonly”属性时不起作用。
最近的一个项目用到了Spring标签<form:textarea>,当在设置其只读属性时,使用readonly="readonly"不起作用,还是能修改内容. 在网上找 ...
- [Git]06 如何提交空目录
git和 svn不同,仅仅跟踪文件的变动,不跟踪目录.所以,一个空目录,如果里面没有文件,即便 git add 这个目录,另外在别处 check out 的时候,是没有这个空目录的. 只跟踪文件 ...
- hadoop高可靠性HA集群
概述 简单hdfs高可用架构图 在hadoop2.x中通常由两个NameNode组成,一个处于active状态,另一个处于standby状态.Active NameNode对外提供服务,而Standb ...
- 蓝桥杯-李白打酒-java
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...
- hdu1054最小顶点覆盖
最小定点覆盖是指这样一种情况: 图G的顶点覆盖是一个顶点集合V,使得G中的每一条边都接触V中的至少一个顶点.我们称集合V覆盖了G的边.最小顶点覆盖是用最少的顶点来覆盖所有的边.顶点覆盖数是最小顶点覆盖 ...