jQuery碎片

1，DOM通緝

創(chuàng)新互聯(lián)建站是一家專注于成都網(wǎng)站制作、成都做網(wǎng)站與策劃設(shè)計(jì),冷水灘網(wǎng)站建設(shè)哪家好?創(chuàng)新互聯(lián)建站做網(wǎng)站,專注于網(wǎng)站建設(shè)10余年,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:冷水灘等地區(qū)。冷水灘做網(wǎng)站價(jià)格咨詢:18980820575

a、css選擇器（4類）：tag 標(biāo)簽名 | .class 類名 | #id 唯一標(biāo)識(shí) | *

b、組合選擇器：

并列組合：s1s2 匹配s1和s2

s1，s2 匹配s1或者s2

s1:not(s2)匹配s1但不匹配s2

層級(jí)組合：s1 s2 匹配s2且存在祖先結(jié)點(diǎn)匹配s1

s1:has(s2)匹配s1且存在子孫節(jié)點(diǎn)匹配s2

s1 > s2 匹配s2且父節(jié)點(diǎn)匹配s1

s1 + s2 匹配s2且前驅(qū)節(jié)點(diǎn)匹配s1

s1~s2 匹配s2且上文有兄弟節(jié)點(diǎn)匹配s1

c、偽類選擇器：

索引：:first 第一個(gè)、:last 最后一個(gè)、:even 偶數(shù)的、:odd 奇數(shù)的、:eq() 等于、:lt() 小于、:gt() 大于

內(nèi)容：:contains()、:empty、:parent、:header、:animated

狀態(tài)：:hidden、:visited、:enabled、:disabled、:checkde、:selected

父子：:nth-child(…)、:first-child、:last-child、:only-child

表單：:input、:text、:password、:radio、:checkbox、:file、:button 、:submit、:reset、:p_w_picpath

d、屬性過濾器：

[屬性=值] ：存在特定屬性，且屬性值等于特定值

[屬性!=值] ：存在特定屬性，且屬性值不等于特定值

[屬性^=值]：存在特定屬性，且屬性值以特定值開始

[屬性$=值]：存在特定屬性，且屬性值以特定值結(jié)束

[屬性*=值] ：存在特定屬性，且屬性值包含特定值

2，事件綁定

a、傳統(tǒng)的事件綁定有三種方式：

修改標(biāo)簽，設(shè)置相應(yīng)的onXXX屬性。例：<a href=“#” </a>

先定義事件響應(yīng)函數(shù)，再綁定到事件。例：function btnSubmit_ alert(“hi!”); }var btn = document.getElementById(“#btnSubmit”);btn.onclick=btnSubmit;

直接綁定匿名函數(shù)。例：var btn = document.getElementById(“#btnSubmit”);btn. alert(“hi!”);}

b、jQuery 對(duì)象通過成員函數(shù)綁定 W3C 標(biāo)準(zhǔn)事件

°函數(shù)名：事件名稱(沒有前綴 on)，例如：click

°參數(shù)：事件響應(yīng)函數(shù)，通常用匿名函數(shù)。$(“#btnSubmit”).click(function(){ alert(“hi!”);});

c、jQuery 對(duì)象的 bind(…)方法也可以綁定事件。

$(“#btnSubmit”).bind(“click”,function(){ alert(“hi!”);});

3，控制css

a、css(name)：參數(shù) name ：樣式名。功能：返回 jQuery 對(duì)象首個(gè)元素的 name 樣式定義。

b、css(name , value)：參數(shù) name ：樣式名。參數(shù) value ：樣式定義。功能：給 jQuery 對(duì)象中所有元素設(shè)置指定樣式。 c、css(properties)：參數(shù) properties ：包含”樣式名:樣式定義”鍵值對(duì)的對(duì)象。功能：按鍵值對(duì)給 jQuery 對(duì)象所有元素設(shè)置樣式。

d、vheight()、width() 返回第一個(gè)DOM元素的高度像素值。如果帶參數(shù)，則設(shè)置 height 樣式為相應(yīng)值。

e、show()、hide()°顯示所有 DOM 元素。°可帶一個(gè)整數(shù)參數(shù) d，實(shí)現(xiàn) d 毫秒內(nèi)顯示的特效。°第二個(gè)參數(shù)可選，為特效完成時(shí)的回調(diào)函數(shù)。

f、toggle()：所有DOM元素在顯示與隱藏之間來(lái)回切換。

g、text()、text(value)°讀取第一個(gè)DOM 元素的關(guān)聯(lián)文本值、設(shè)置 innerText = value。

h、html()、html(value)°讀取第一個(gè) DOM 元素的 innerHTML 值。設(shè)置innerHTML = value

i、attr(name)、attr(name,value)、 removeAttr(name)°讀取第一個(gè) DOM 元素指定屬性的值或 undefined ?！阋瞥?DOM 元素名為 name 的屬性。

4，訪問DOM元素集

a、find (expr) °參數(shù)expr ：選擇器 °功能：生成當(dāng)前對(duì)象副本，但是從每個(gè)DOM 元素內(nèi)部再次匹配檢索器 expr 。

b、size () 或 length () °功能：返回DOM 元素總數(shù)。

c、slice (from , to) °參數(shù)from：起始元素下標(biāo) °參數(shù)to：結(jié)束元素下標(biāo) + 1 °功能：生成對(duì)象副本但移除從from 到 (to – 1) 的DOM元素。 °注意：此方法不改變當(dāng)前對(duì)象。

d、each (fn) °參數(shù)fn ：回調(diào)函數(shù)，形參為當(dāng)前 DOM 元素的索引值。 °功能：依次對(duì)每個(gè)DOM 元素執(zhí)行回調(diào)函數(shù) fn。°實(shí)例：$("img").each(function(i){this.src = "test" + i + ".jpg"; });

e、is (expr) °參數(shù)expr：選擇器功能：判斷是否至少有一個(gè)DOM 元素符合選擇器 expr 。

f、append (text)°參數(shù) text ：待添加的文本?！愎δ埽合蛎總€(gè) DOM 元素內(nèi)部結(jié)尾處添加指定文本。

j、prepend (text)°功能：向每個(gè) DOM 元素內(nèi)部開始處添加指定文本。

h、before (text)、after (text)°功能：向每個(gè) DOM 元素之前（后）插入指定文本。

i、add (html)°參數(shù) html ：創(chuàng)建元素的 HTML 代碼?！愎δ埽簞?dòng)態(tài)添加新元素。

g、remove (expr)°功能：生成當(dāng)前對(duì)象副本，但移除匹配 expr （選擇器）的 DOM 元素。

k、empty()°功能：生成當(dāng)前對(duì)象副本，但移除所有DOM 元素。

l、prev (expr)、next (expr)、parent(expr)、children (expr)、siblings (expr)°功能：返回每個(gè)DOM 元素的前趨、后繼同輩元素、父元素、子元素、同輩元素。

5，ajax支持

a、AJAX 是一種流行的 B/S 技術(shù)，其中包含三個(gè)要點(diǎn)：°A = 異步操作，也即先加載后處理；°J = Javascript 腳本；°X = XML ，目前出現(xiàn)了 JSON 與之抗衡。

b、jQuery 為 AJAX 提供了兩個(gè)層次的訪問函數(shù)，以及 6 種狀態(tài)事件：

°高級(jí)函數(shù)：$.get (url, params, callback);$.post (url, params, callback); load (url, params, callback);

°低級(jí)函數(shù)：$.ajax(params)

°狀態(tài)事件：ajaxSuccess、ajaxError、ajaxComplete、ajaxSend、ajaxStart、ajaxStop、

c、$.get(url , p , fn)、$.post(url , p , fn , type)

°參數(shù)url ：請(qǐng)求的頁(yè)面 URL 。

°參數(shù)p ：(可選)請(qǐng)求參數(shù)(鍵值對(duì)對(duì)象) 。

°參數(shù)fn ： (可選)操作成功觸發(fā)的回調(diào)函數(shù)。

°功能：通過GET 方法加載遠(yuǎn)程頁(yè)面。

°注意：回調(diào)函數(shù)fn 可以通過參數(shù)處理加載的數(shù)據(jù)。

如果需要處理操作失敗的狀態(tài)，請(qǐng)改用$.ajax(…) 。

d、$.ajax (opt)

°參數(shù)opt：配置 Ajax 請(qǐng)求的鍵值對(duì)對(duì)象。常用的鍵名有：data: 請(qǐng)求參數(shù)，可以是字符串、鍵值對(duì)對(duì)象或字符串?dāng)?shù)組。dataType: 期望數(shù)據(jù)類型，可以是html、xml、json、script等。timeout: 操作時(shí)限(秒)。每次設(shè)置都將改寫默認(rèn)值。type: 發(fā)送請(qǐng)求的方法，默認(rèn)為 GET。url: 遠(yuǎn)程 URL。其它：beforeSend、success、error、complete (4個(gè)事件)

°功能：返回包含遠(yuǎn)程響應(yīng)數(shù)據(jù)的XMLHttpRequest 對(duì)象。參數(shù)鍵都是可選的，默認(rèn)值可通過$.ajaxSetup (opt) 設(shè)置。

6，Q&A

a、jQuery 對(duì)象如何轉(zhuǎn)成 DOM 元素?

°通過下標(biāo)索引或get(index)方法

°例如：$(“div”)[0] ; $(“div”).get(0)

b，jQuery 對(duì)象和 DOM 元素的區(qū)別是什么？

°首先，jQuery 對(duì)象維護(hù)一個(gè) DOM 元素的數(shù)組；

°其次，jQuery 對(duì)象不能使用 DOM 方法，反之亦然。

°例如：$(“div”).html() ; $(“div”)[0].innerHTML

本文名稱：jQuery碎片
網(wǎng)頁(yè)地址：http://bm7419.com/article0/gegcio.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站內(nèi)鏈、企業(yè)建站、網(wǎng)站營(yíng)銷、搜索引擎優(yōu)化、ChatGPT、標(biāo)簽優(yōu)化

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容