按以下幾類(lèi)分解
一、選擇器(定位元素方法)方法
$("各種類(lèi)型選擇器")
二、篩選方法
$("xxx").find()等
三、對DOM元素的增、刪、改方法
如append/remove/html/clone等
四、對DOM元素屬性的增、刪、改方法
如attr/css/val等方法
五、對集合的處理方法
如json/each等方法
六、對事件的綁定方法
如click/bind/live/toggle等方法
七、其它常用方法
如ajax等
animate()
對被選元素應用“自定義”的動(dòng)畫(huà)
clearQueue()
對被選元素移除所有排隊的函數(仍未運行的)
delay()
對被選元素的所有排隊函數(仍未運行)設置延遲
dequeue()
運行被選元素的下一個(gè)排隊函數
fadeIn()
逐漸改變被選元素的不透明度,從隱藏到可見(jiàn)
fadeOut()
逐漸改變被選元素的不透明度,從可見(jiàn)到隱藏
fadeTo()
把被選元素逐漸改變至給定的不透明度
hide()
隱藏被選的元素
queue()
顯示被選元素的排隊函數
show()
顯示被選的元素
slideDown()
通過(guò)調整高度來(lái)滑動(dòng)顯示被選元素
slideToggle()
對被選元素進(jìn)行滑動(dòng)隱藏和滑動(dòng)顯示的切換
slideUp()
通過(guò)調整高度來(lái)滑動(dòng)隱藏被選元素
stop()
停止在被選元素上運行動(dòng)畫(huà)
toggle()
對被選元素進(jìn)行隱藏和顯示的切換
總共有三種引用方式。
1、最常用的,引入樣式表,在樣式表中編寫(xiě)樣式,引入方式如下:
<link href="css/style.css" rel="stylesheet" type="text/css">
2、在Html頭部用<style></style>;包起來(lái),在這里面編寫(xiě)樣式:
<style type="text/css">
*{
padding: 0;margin: 0
}
</style>
3、在標簽里面直接編寫(xiě)行內樣式。
<div style="color: #333"><div>
當然還有一種方式是用JS直接更改或者賦值給某個(gè)標簽,但是其實(shí)是屬于第三種的范圍的。
引用
寫(xiě)文章時(shí),有意引用成語(yǔ)、詩(shī)句、格言、典故等, 以表達自己想要表達的思想感情,說(shuō)明自己對新問(wèn)題、新道理的見(jiàn)解,這種修辭手法叫引用。
屬性: 獲得標簽:$("#id")獲得標簽內的代碼:.html()獲得標簽內的文本:.text()修改標簽內的代碼:.html("內容");修改標簽內的文本:.html("內容");獲得標簽屬性:.attr("屬性");修改標簽屬性:attr("屬性","屬性值");添加樣式:addClass("樣式名");動(dòng)態(tài)切換樣式:toggleClass("樣式名");獲取樣式:css添加元素:append("元素");移去元素:.remove();清空節點(diǎn): .empty();獲取第二個(gè)li節點(diǎn): var $li=$("ul li:eq(1)");獲取第二個(gè)li節點(diǎn)的文本內容: var li_txt=$方法:一:插入節點(diǎn):append() 向每個(gè)匹配的元素文本內部的后面追加內容eg:我想說(shuō): 代碼: $("p").append("你好");結果為:我想說(shuō): 你好appendto() 將所有的匹配的元素追加到指定的元素中。
實(shí)際上,使用該方法是顛倒了常規的$(A).append(B)的操作,即不是B追加到A中,而是將A追加到B文本的后面中。eg:我想說(shuō): 代碼: $("你好").appendTo("p");結果為:我想說(shuō): 你好prepend() 向每個(gè)匹配的元素文本的內部前置內容。
eg:我想說(shuō): 代碼: $("p").prepend("你好");結果為: 你好我想說(shuō):prependto() 將所有的匹配的元素前置到指定的元素中。實(shí)際上,使用該方法是顛倒了常規的$(A).append(B)的操作,即不是B前置到A中,而是將A前置到B中eg:我想說(shuō): 代碼: $("你好").prependto("p");結果為: 你好我想說(shuō):after() 向每個(gè)匹配的元素之后插入內容 。
eg:我想說(shuō): 代碼: $("p").after("你好");結果為:我想說(shuō): 你好insertAfter 將所有的匹配的元素插入到指定的元素后面。實(shí)際上,使用該方法是顛倒了常規的$(A).append(B)的操作,即不是B插入到A后面,而是將A插入到B后面。
eg:我想說(shuō): 代碼: $("你好").after("p");結果為:我想說(shuō): 你好before() 在每個(gè)匹配的元素之前插入內容eg:我想說(shuō): 代碼: $("你好").after("p");結果為:我想說(shuō): 你好insertBefore():將A標簽插入到B標簽的前面二:刪除:①remove 該節點(diǎn)所包含的所有的后代節點(diǎn)將同時(shí)被刪除 也可以通過(guò)參數來(lái)選擇②empty 清空節點(diǎn),它能清空元素中的所有后代節點(diǎn)三:替換節點(diǎn):①replaceWith() 作用是將所有匹配的元素都替換成指定的HTML或DOM元素②replaceAll() 四:包裹節點(diǎn):①warp() 作用是是將所有元素進(jìn)行單獨包裹②warpAll() 作用元素的是所有匹配的元素用一個(gè)元素來(lái)包裹③warpinner() 作用是將每一個(gè)的子內容(包括文本節點(diǎn))用其他結構化的標記包裹起來(lái)五:設置和獲取HTML、文本值1、html():2、text3、val六:遍歷節點(diǎn)1、children(): 取得匹配元素的子元素2、next():取得匹配元素后面緊鄰的同輩元素3、prev():取得匹配元素前面緊鄰的同輩元素4、siblings():取得匹配元素前后所有的同輩元素5、closest():取得最近的匹配元素七:css-domcss 獲取樣式的屬性offset()樣式操作:1:獲取樣式和設置樣式 attreg:你最喜歡的水果是? 獲取樣式: var p_class=$("p").attr("class");設置樣式:$("p").attr("class","high");2:追加樣式 addClass追加樣式: $("input:eq(2)").click(function(){$("p".addClass("another"))})☆在css中有以下規定:①如果給一個(gè)元素添加了多個(gè)class值,那么就相當于合并了他們的樣式②如果不同的class設置了同一樣式,則后者覆蓋前者addClass attr對同一個(gè)網(wǎng)頁(yè)元素進(jìn)行操作 test test 第一次使用 $.addClass("high"); $.attr("class","high");第一次結果 test test 再次使用 $.addClass("another"); $.attr("class","another");最終結果 test test 3:移除樣式 removeClasstest 移除一個(gè):$.removeClass("high");移除二個(gè):$.removeClass("high").removeClass("another");==$.removeClass("high another")移除全部:$.removeClass();4:切換樣式 toggle5:判斷是否含有摸個(gè)樣式 hasClass可以用來(lái)判斷元素中是否含有某個(gè)class,如果有返回true否則返回false。
1、JQuery的核心的一些方法 each(callback) '就像循環(huán)$("Element").length; '元素的個(gè)數,是個(gè)屬性$("Element").size(); '也是元素的個(gè)數,不過(guò)帶括號是個(gè)方法$("Element").get(); '某個(gè)元素在頁(yè)面中的集合,以數組的形式存儲$("Element").get(index); '功能和上面的相同,index表示第幾個(gè)元素,數組的下標$("Element").get().reverse(); '把得到的數組方向$("Element1").index($("Element2")); '元素2在元素1中的索引值是。
2、基本對象獲取(注意這里獲取的都是Jquery對象而不是Dom對象哦,但是他倆是可以轉換滴)$("*") ‘表示獲取所有對象 但是我至今沒(méi)這樣用過(guò)$("#XXX") '獲得 id=XXX 的元素對象(id可以是標簽的id或CSS樣式id) 常用$("input[name='username']") 獲得input標簽中name='userName'的元素對象 常用$(".abc") ' 獲得樣式class的名字是.abc的元素對象 常用$("div") ' 標簽選擇器 選擇所有的div元素 常用$("#a,.b,span") '表示獲得ID是a的元素和使用了類(lèi)樣式b的元素以及所有的span元素$("#a .b p") 'ID號是a的并且使用了 b樣式的 所有的p元素3、層級元素獲取$("Element1 Element2 Element3 。.") '前面父級 后面是子集$("div > p") '獲取div下面的所有的 p元素$("div + p") 'div元素后面的第一個(gè) p元素$("div ~ p") 'div后面的所有的 p元素4、簡(jiǎn)單對象獲取$("Element:first") 'HTML頁(yè)面中某類(lèi)元素的第一個(gè)元素$("Element:last") 'HTML頁(yè)面中某類(lèi)元素的最后一個(gè)元素$("Element:not(selector)") '去除所有與給定選擇器匹配的元素,如:$("input:not(:checked)") 表示選擇所有沒(méi)有選中的復選框$("Element:even") '獲得偶數行$("Element:odd“)'獲得奇數行$("Element:eq(index)") '取得一個(gè)給定的索引值$("Element:gt(index)") '取得給定索引值的元素 之后的所有元素$("Element:lt(index)") '取得給定索引值的元素 之前的所有元素5、內容對象的獲取和對象可見(jiàn)性$("Element:contains(text)") '元素中是否包含text文本內容$('Element:empty") '獲得元素不包含子元素或文本的$("Element:partnt") '獲得元素包含子元素或文本的$("Element:has(selector)") '是否包含某個(gè)元素, 如:$("p:has(span)")表示所有包含span元素的p元素$("Element:hidden") '選擇所有可見(jiàn)元素$("Element:visible") '選擇所有不可見(jiàn)元素6、其他對象獲取方法$("Element[id]") '所有帶有ID屬性的元素$("Element[attribute = youlika ]" '獲得所有某個(gè)屬性為youlika的元素$("Element[attribute != youlika ]" '獲得所有某個(gè)屬性為不是youlika的元素$("Element[attribute ^= youlika ]" '獲得所有某個(gè)屬性為不是youlika的開(kāi)頭的元素$("Element[attribute $= youlika ]" '獲得所有某個(gè)屬性為不是youlika的結尾的元素$("Element[attribute *= youlika ]" '獲得所有某個(gè)屬性包含youlika的開(kāi)頭的元素$("Element[selector1][selector2][。
.]") '符合屬性選擇器,比如$("input[id][name][value=youlika ]")表示獲得帶有ID、Name以及value是youlika 的input元素。
聲明:本網(wǎng)站尊重并保護知識產(chǎn)權,根據《信息網(wǎng)絡(luò )傳播權保護條例》,如果我們轉載的作品侵犯了您的權利,請在一個(gè)月內通知我們,我們會(huì )及時(shí)刪除。
蜀ICP備2020033479號-4 Copyright ? 2016 學(xué)習?shū)B(niǎo). 頁(yè)面生成時(shí)間:2.950秒