Jquery 整理元素選取、常用方法一覽表
更新時(shí)間:2016年11月26日 16:28:30 投稿:lqh
這篇文章主要介紹了Jquery 整理元素選取、常用方法一覽表的相關(guān)資料,這里整理了相關(guān)資料,便于大家查看,需要的朋友可以參考下
Jquery元素選取、常用方法
一:常用的選擇器:
基本選擇器
$(”#myDiv”) //匹配唯一的具有此id值的元素
$(”div”) //匹配指定名稱的所有元素
$(”.myClass”) //匹配具有此class樣式值的所有元素
$(”*”) //匹配所有元素
$(this) //匹配自身
$(”div,span,p.myClass”) //聯(lián)合所有匹配的選擇器層疊選擇器
$(”form input”) //后代選擇器,選擇ancestor的所有子孫節(jié)點(diǎn)
$(”#main > *”) //子選擇器,選擇parent的所有子節(jié)點(diǎn)
$(”label + input”) //臨選擇器,選擇prev的下一個(gè)臨節(jié)點(diǎn)
$(”#prev ~ div”) //同胞選擇器,選擇prev的所有同胞節(jié)點(diǎn)
基本過濾選擇器
$(”tr:first”) //匹配第一個(gè)選擇的元素
$(”tr:last”) //匹配最后一個(gè)選擇的元素
$(”tr:even”) //匹配集合中偶數(shù)位置的所有元素(從0開始)
$(”tr:odd”) //匹配集合中奇數(shù)位置的所有元素(從0開始)
$(”td:eq(2)”) //匹配集合中指定位置的元素(從0開始)
$(”div:animated”) //匹配所有正在運(yùn)行動(dòng)畫的所有元素
內(nèi)容過濾選擇器
$(”div:contains('John')”) //匹配含有指定文本的所有元素
$(”td:empty”) //匹配所有空元素(只含有文本的元素不算空元素)
$(”div:has(p)”) //從原元素集合中再次匹配所有至少含有一個(gè)selector的所有元素
$(”div:hidden”) //匹配所有隱藏的元素,也包括表單的隱藏域
$(”div:visible”) //匹配所有可見的元素
屬性過濾選擇器
$(”div[id]”) //匹配所有具有指定屬性的元素
$(”input[name='aa']”) //匹配所有具有指定屬性值的元素素
$(”input[name^='aa']”) //匹配所有指定屬性值以value開頭的元素
$(”input[name$='aa']”) //匹配所有指定屬性值以value結(jié)尾的元素
$(”input[name*='aa']”) //匹配所有指定屬性值含有value字符的元素
子元素過濾選擇器
$(”ul li:nth-child(n)”), //匹配父元素的第n個(gè)子元素
$(”div span:first-child”) //匹配父元素的第1個(gè)子元素
$(”div span:last-child”) //匹配父元素的最后1個(gè)子元素
表單元素選擇器
$(”:input”) //匹配所有的表單輸入元素,包括所有類型的input, textarea, select 和 button
$(”:text”) //匹配所有類型為text的input元素
$(”:password”) //匹配所有類型為password的input元素
$(”:radio”) //匹配所有類型為radio的input元素
$(”:checkbox”) //匹配所有類型為checkbox的input元素
$(”:submit”) //匹配所有類型為submit的input元素
$(”:image”) //匹配所有類型為image的input元素
$(”:reset”) //匹配所有類型為reset的input元素
$(”:button”) //匹配所有類型為button的input元素
$(”:file”) //匹配所有類型為file的input元素
$(”:hidden”) //匹配所有類型為hidden的input元素或表單的隱藏域表單元素過濾選擇器
$(”:enabled”) //匹配所有可操作的表單元素
$(”:disabled”) //匹配所有不可操作的表單元素
$(”:checked”) //匹配所有已點(diǎn)選的元素
二:常用方法
//常用操作
.eq(i) //獲取第幾個(gè)元素
.text() //獲取或設(shè)置元素文本內(nèi)容
.html() //獲取或設(shè)置元素html代碼內(nèi)容
.val() //獲取或設(shè)置表單元素值
.attr() //獲取或設(shè)置屬性,適用于自定義屬性
.removeAttr() //移除屬性
.css() //獲取或設(shè)置樣式
.addClass() //設(shè)置class
.removeClass() //移除class
.prop() //操作屬性,適用于固定屬性
.trim() //去除空格
//追加移除
.after(); //在匹配元素后面添加內(nèi)容
.append(); //將content作為元素的內(nèi)容插入到該元素的后面
.appendTo(); //在content后接元素
.before(); //與after方法相反
.empty() //將該元素的內(nèi)容設(shè)置為空
.remove(); //刪除所有的指定元素
//相關(guān)元素
.filter( expr ) //返回與指定表達(dá)式匹配的元素集合
.children() //找子級(jí)元素
.parent() //找父級(jí)元素
.next(expr) //后面同輩元素的元素。
.prev(expr) //前面同輩元素的元素
.find(expr) //搜索所有與指定表達(dá)式匹配的元素。
.add(html) //追加元素
//事件
.unbind("blur") //移除事件
.bind("blur",function(){}) //綁定事件
.hover(function(){}) //鼠標(biāo)移上
//動(dòng)畫
.show( ) 顯示隱藏的匹配元素。
.hide( ) 隱藏所有的匹配元素。
.toggle( ) 切換元素的可見狀態(tài)。
.slideDown( speed, [callback] ) 通過高度變化(向下增大)來動(dòng)態(tài)地顯示所有匹配的元素,在顯示完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。這個(gè)動(dòng)畫效果只調(diào)整元素的高度,可以使匹配的元素以“滑動(dòng)”的方式顯示出來。
.slideUp( speed, [callback] ) 通過高度變化(向上減?。﹣韯?dòng)態(tài)地隱藏所有匹配的元素,在隱藏完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。這個(gè)動(dòng)畫效果只調(diào)整元素的高度,可以使匹配的元素以”滑動(dòng)”的方式隱藏起來。
.slideToggle( speed, [callback] ) 通過高度變化來切換所有匹配元素的可見性,并在切換完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。 這個(gè)動(dòng)畫效果只調(diào)整元素的高度,可以使匹配的元素以”滑動(dòng)”的方式隱藏或顯示。
.fadeIn( speed, [callback] ) 通過不透明度的變化來實(shí)現(xiàn)所有匹配元素的淡入效果,并在動(dòng)畫完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。 這個(gè)動(dòng)畫只調(diào)整元素的不透明度,也就是說所有匹配的元素的高度和寬度不會(huì)發(fā)生變化。
.fadeOut( speed, [callback] ) 通過不透明度的變化來實(shí)現(xiàn)所有匹配元素的淡出效果,并在動(dòng)畫完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。 這個(gè)動(dòng)畫只調(diào)整元素的不透明度,也就是說所有匹配的元素的高度和寬度不會(huì)發(fā)生變化。
.fadeTo( speed, opacity, [callback] ) 把所有匹配元素的不透明度以漸進(jìn)方式調(diào)整到指定的不透明度,并在動(dòng)畫完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。 這個(gè)動(dòng)畫只調(diào)整元素的不透明度,也就是說所有匹配的元素的高度和寬度不會(huì)發(fā)生變化。
.stop( ) 停止所有匹配元素當(dāng)前正在運(yùn)行的動(dòng)畫。如果有動(dòng)畫處于隊(duì)列當(dāng)中,他們就會(huì)立即開始。
.queue( ) 取得第一個(gè)匹配元素的動(dòng)畫序列的引用(返回一個(gè)內(nèi)容為函數(shù)的數(shù)組)
.queue( callback ) 在每一個(gè)匹配元素的事件序列的末尾添加一個(gè)可執(zhí)行函數(shù),作為此元素的事件函數(shù)
.queue( queue ) 以一個(gè)新的動(dòng)畫序列代替所有匹配元素的原動(dòng)畫序列
.dequeue( ) 執(zhí)行并移除動(dòng)畫序列前端的動(dòng)畫
.animate( params, [duration], [easing], [callback] ) 用于創(chuàng)建自定義動(dòng)畫的函數(shù)。
.animate( params, options ) 創(chuàng)建自定義動(dòng)畫的另一個(gè)方法
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
您可能感興趣的文章:
- jquery中push()的用法(數(shù)組添加元素)
- jQuery父級(jí)以及同級(jí)元素查找介紹
- JQuery中根據(jù)屬性或?qū)傩灾但@得元素(6種情況獲取方法)
- jquery中獲取元素的幾種方式小結(jié)
- jquery獲取元素索引值index()示例
- jQuery 刪除或是清空某個(gè)HTML元素示例
- jquery移除、綁定、觸發(fā)元素事件使用示例詳解
- JQuery獲取元素文檔大小、偏移和位置和滾動(dòng)條位置的方法集合
- jQuery給動(dòng)態(tài)添加的元素綁定事件的方法
- js jquery獲取當(dāng)前元素的兄弟級(jí) 上一個(gè) 下一個(gè)元素
相關(guān)文章
Jquery中ajax方法data參數(shù)的用法小結(jié)
本篇文章主要是對(duì)Jquery中ajax方法data參數(shù)的用法進(jìn)行了總結(jié)介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2014-02-02
JQuery 拾色器插件發(fā)布-jquery.icolor.js
web項(xiàng)目中不少地方需要用到顏色選擇器,比如設(shè)置某個(gè)元素的背景色、邊框色等等,按照我們交互設(shè)計(jì)的期望-設(shè)色器最好簡(jiǎn)單易用,僅顯示常用的那些色塊給用戶選擇,另外提供一個(gè)輸入框方便用戶輸入自定義的色值。2010-10-10
使用jQuery實(shí)現(xiàn)Web頁面換膚功能的要點(diǎn)解析
網(wǎng)頁換膚的實(shí)質(zhì)就是切換CSS樣式,關(guān)鍵是給用戶做出點(diǎn)擊切換的功能以及換膚完成之后的緩存記錄功能,下面我們就來看一下使用jQuery實(shí)現(xiàn)Web頁面換膚功能的要點(diǎn)解析:2016-05-05
jQuery AJAX實(shí)現(xiàn)調(diào)用頁面后臺(tái)方法和web服務(wù)定義的方法分享
jQuery AJAX實(shí)現(xiàn)調(diào)用頁面后臺(tái)方法和web服務(wù)定義的方法分享,需要的朋友可以參考下2012-03-03
Easyui在treegrid添加控件的實(shí)現(xiàn)方法
這篇文章主要介紹了Easyui在treegrid添加控件的實(shí)現(xiàn)方法,需要的朋友可以參考下2017-06-06
ajax無刷新動(dòng)態(tài)調(diào)用股票信息(改良版)
今日閑來無事,把上次寫的代碼稍微改了改。增加了動(dòng)態(tài)追加和刪除股票信息的功能(代碼基于jquery運(yùn)行:http://jquery.com/) 。由于對(duì)Ajax技術(shù)的認(rèn)識(shí)還只是在初級(jí)階段,總覺得這么些有點(diǎn)別扭,希望大蝦能夠指點(diǎn)一二。2008-11-11
jquery使用正則表達(dá)式驗(yàn)證email地址的方法
這篇文章主要介紹了jquery使用正則表達(dá)式驗(yàn)證email地址的方法,以實(shí)例形式分析了正則表達(dá)式的使用技巧,需要的朋友可以參考下2015-01-01

