jQuery总结二:DOM遍历和事件处理

文章源自:淡忘~浅思
原文地址:http://www.ido321.com/1607.html

1.筛选元素

方法                 返回的元素
.filter(selector)    与selector匹配的元素
.filter(callbaxk)    callback中返回true的元素
.eq(index)          从0开始计数的第index个选中元素
.first()              选中元素中的第一个元素
.last()            选中元素的最后一个元素
.slice(start[,end])   从0开始计数的给定范围内的选中元素
.not(selector)      与selector不匹配的元素
.has(selector)      与selector匹配的的后代元素

2.后代元素

方法                  返回的元素
.find(selector)        与selector匹配的后代元素
.contents()         子节点(包括文本节点)
.children([selector])  子节点,可传入selector进行筛选

3.同辈元素

方法                             返回的元素
.next([selector])                每个选中元素紧邻的下一个元素,可传入selector进行筛选
.nextAll([selector])              每个选中元素后的所有同辈元素,可传入selector进行筛选
.nextUntil([selector],[filter])   每个选中元素之后、直至但不包含第一个和selector匹配的元素,可传入filter进行筛选
.prev([selector])                每个选中元素紧邻的上一个元素,可传入selector进行筛选
.prevAll([selector])              每个选中元素前的所有同辈元素,可传入selector进行筛选
.prevUntil([selector],[filter])   每个选中元素之前、直至但不包含第一个和selector匹配的元素,可传入filter进行筛选
.siblings([selector])            所有同辈元素,可传入selector进行筛选

4.祖先元素

方法                               返回的元素
.parent([selector])              每个选中元素的父元素,可传入selector进行筛选
.parents([selector])                每个选中元素的所有祖先元素,可传入selector进行筛选
.parentsUntil([selector],[filter])  每个选中元素的所有祖先元素、直至但不包含第一个和selector匹配的元素,可传入filter进行筛选
.closest(selector)                  与selector匹配的第一个元素,从元素自身开始沿DOM数向上搜索祖先元素
.offsetParent()                     选中元素的第一个被定为的父元素(relative或absolute)

5.集合操作

方法                 说明
.add([selector])      将与selector匹配的元素添加原对象集合中
.addBack()          选中的元素加上JQuery内部栈中之前选中的元素
.end()              内部JQuery栈中之前选中的元素
.map(callback)      对每个选中调用回调函数callback之后的结果
.pushStack()          指定的元素

6.操作选中的元素

方法                 说明
.is(selector)         确定匹配的元素中是否有传入的与selector匹配的元素
.index()              取得匹配元素相对其同辈元素的索引
.index(element)    取得匹配元素中与指定元素对象的DOM节点的索引
$.contains(a,b)    确定DOM节点a是否包含DOM节点b
.each(callback)    迭代匹配元素,对每个元素执行callback
.length            取得匹配元素的数量
.get()              取得与匹配元素对应的DOM节点列表
.get(index)        取得匹配元素中与指定索引对应的DOM节点
.toArray()          取得与匹配元素对应的DOM节点列表

7.事件绑定

方法                                    说明
.ready(handler)                       DOM和CSS完全加载后之间handler
.on(type,[selector],[data],handler)   绑定type事件,并指定事件处理程序handler;如果指定selector则执行事件委托
.on(events,[selector],[data])            根据events对象的事件绑定多个事件处理程序
.off(type,[selector],handler)           解除on给元素绑定的事件处理程序
.bind(type,[data],handler)             绑定type事件,并指定事件处理程序handler
.one(type,[data],handler)               绑定type事件,并指定事件处理程序handler,handler被调用后立即解除绑定
.unbind([type],[handler])               解除bind给元素绑定的指定事件处理程序(不指定则解除所有指定)
.delegate(selector,type,[data],handler)  给与selector匹配的元素绑定type事件,并指定事件处理程序handler
.delegate(selector,handlers)             给与selector匹配的元素绑定type事件,并指定事件处理程序handlers
.undelegate(selector,type,[handler])     解除delegate给元素绑定的指定事件处理程序

8.其它方法

方法                         说明
.trigger(type,[data])        触发元素上的事件并执行事件的默认操作
.triggerHandler(type,[data])  触发元素上的事件,但不执行事件的默认操作
$.proxy(fn,context)           创建一个新的在指定上下文中执行的函数。

详见:jquery中$.proxy的使用

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,524评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,869评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,813评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,210评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,085评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,117评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,533评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,219评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,487评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,582评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,362评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,218评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,589评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,899评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,176评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,503评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,707评论 2 335

推荐阅读更多精彩内容

  • 原文链接 http://blog.poetries.top/2016/10/20/review-jQuery 关注...
    程序员poetry阅读 16,630评论 18 503
  • DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作。但实际上...
    阿r阿r阅读 999评论 0 9
  • 第1章 简介 第2章 DOM节点的创建 2-1 DOM创建节点及节点属性 通过JavaScript可以很方便的获...
    mo默22阅读 797评论 0 8
  • 1:jQuery节点创建与属性的处理 创建元素节点:可以有几种方式,后面会慢慢接触。常见的就是直接把这个节点的结构...
    码农小杨阅读 588评论 0 1
  • (续jQuery基础(1)) 第5章 DOM节点的复制与替换 (1)DOM拷贝clone() 克隆节点是DOM的常...
    凛0_0阅读 1,306评论 0 8