jQuery

jQuery 能做什么?

Jquery是繼prototype之后又一個(gè)優(yōu)秀的Javascrīpt框架。它是輕量級(jí)的js庫(壓縮后只有21k) ,它兼容CSS3,還兼容各種瀏覽器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。jQuery使用戶能更方便地處理HTML documents、events、實(shí)現(xiàn)動(dòng)畫效果,并且方便地為網(wǎng)站提供AJAX交互。jQuery還有一個(gè)比較大的優(yōu)勢(shì)是,它的文檔說明很全,而且各種應(yīng)用也說得很詳細(xì),同時(shí)還有許多成熟的插件可供選擇。jQuery能夠使用戶的html頁保持代碼和html內(nèi)容分離,也就是說,不用再在html里面插入一堆js來調(diào)用命令了,只需定義id即可。

jQuery 對(duì)象和 DOM 原生對(duì)象有什么區(qū)別?如何轉(zhuǎn)化?

  • DOM對(duì)象擁有DOM對(duì)象的屬性方法。
  • jQuery對(duì)象:是DOM元升級(jí)對(duì)象經(jīng)過包裝之后,擁有jQuery的屬性和方法(對(duì)原生DOM對(duì)象的封裝);
  • jQuery對(duì)象是一個(gè)數(shù)據(jù)對(duì)象,可以通過[index]的方法,來得到相應(yīng)的DOM對(duì)象。
    如:var $el =$("#element") ; //jQuery對(duì)象
    var el=$el[0]; //DOM對(duì)象
  • jQuery本身提供,通過.get(index)方法,得到相應(yīng)的DOM對(duì)象
    如:var $el=$("#element"); //jQuery對(duì)象
    var el=$el.get(0); //DOM對(duì)象
    -對(duì)于DOM對(duì)象,只需要用$()把DOM對(duì)象包裝起來,就可以獲得一個(gè)jQuery對(duì)象了

jQuery中如何綁定事件?bind、unbind、delegate、live、on、off都有什么作用?推薦使用哪種?使用on綁定事件使用事件代理的寫法?

  • 最簡(jiǎn)單的是bind(type,handle),這種方式的寫法和type(handle)寫法的作用是相同的($('a').click(function(){})),對(duì)應(yīng)的取消事件的方法是unbind:如果不帶參數(shù)默認(rèn)移除所有的綁定事件,若帶參數(shù)則移除指定的事件監(jiān)聽($(‘p’).unbind('click'))。bind這種是直接在符合條件的元素上綁定監(jiān)聽函數(shù),因此沒生成一個(gè)新的元素,就需要給新元素綁定一次事件
  • bind(type,[data],fn) 為每個(gè)匹配元素的特定事件綁定事件處理函數(shù)。
  • unbind(type,[data|fn]]) bind()的反向操作,從每一個(gè)匹配的元素中刪除綁定的事件。
  • delegate(selector,[type],[data],fn) 指定的元素(屬于被選元素的子元素)添加一個(gè)或多個(gè)事件處理程序,并規(guī)定當(dāng)這些事件發(fā)生時(shí)運(yùn)行的函數(shù)。
  • live(type, [data], fn) jQuery 給所有匹配的元素附加一個(gè)事件處理函數(shù),即使這個(gè)元素是以后再添加進(jìn)來的也有效。
    這個(gè)方法是基本是的 .bind() 方法的一個(gè)變體。使用 .bind() 時(shí),選擇器匹配的元素會(huì)附加一個(gè)事件處理函數(shù),而以后再添加的元素則不會(huì)有。為此需要再使用一次 .bind() 才行
  • on(events,[selector],[data],fn) 在選擇元素上綁定一個(gè)或多個(gè)事件的事件處理函數(shù)。
  • off(events,[selector],[fn]) 在選擇元素上移除一個(gè)或多個(gè)事件的事件處理函數(shù)。
$("p").on("click", function(){
alert( $(this).text() );
});

jQuery 如何展示/隱藏元素?

$('div').hide([duration][,easing][,complete]);//隱藏
$('div').slideUp([duration][,easing][,complete]);//向上收起
$('div').fadeOut([duration][,easing][,complete]);//淡出

$('div').show([duration][,easing][,complete]);//隱藏
$('div').slideDown([duration][,easing][,complete]);//向下滑出
$('div').fadeIn([duration][,easing][,complete]);//淡入


#jQuery 動(dòng)畫如何使用?
- animate(params,[speed],[easing],[Callback]) 用于創(chuàng)建自定義動(dòng)畫的函數(shù)。這個(gè)函數(shù)的關(guān)鍵在于指定動(dòng)畫形式及結(jié)果樣式屬性對(duì)象。
- 必需的 params 參數(shù)定義形成動(dòng)畫的 CSS 屬性。
可選的 speed 參數(shù)規(guī)定效果的時(shí)長(zhǎng)。它可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數(shù)是動(dòng)畫完成后所執(zhí)行的函數(shù)名稱。
當(dāng)動(dòng)畫 100% 完成后,即調(diào)用回調(diào)函數(shù) Callback。

#如何設(shè)置和獲取元素內(nèi)部 HTML 內(nèi)容?如何設(shè)置和獲取元素內(nèi)部文本?

html();獲取html內(nèi)容,有值的話就是設(shè)置html內(nèi)容
$('div').html();//獲取內(nèi)容
$('div').html('<p>我是段落</p>');//設(shè)置內(nèi)容

text();獲取文本元素,有值的話就是設(shè)置文本內(nèi)容
$('p').text();//獲取文本
$('p').text('我不是段落')//設(shè)置文本


#如何設(shè)置和獲取表單用戶輸入或者選擇的內(nèi)容?如何設(shè)置和獲取元素屬性?

$('input').val()//獲取
$('input').val('hello')//設(shè)置

設(shè)置和獲取元素屬性
$('input').attr('type')//獲取屬性,屬性名不能為空
$('input').attr('sex','women')//設(shè)置

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 1.JQuery 基礎(chǔ) 改變web開發(fā)人員創(chuàng)造搞交互性界面的方式。設(shè)計(jì)者無需花費(fèi)時(shí)間糾纏JS復(fù)雜的高級(jí)特性。 1....
    LaBaby_閱讀 1,501評(píng)論 0 2
  • 1.JQuery 基礎(chǔ) 改變web開發(fā)人員創(chuàng)造搞交互性界面的方式。設(shè)計(jì)者無需花費(fèi)時(shí)間糾纏JS復(fù)雜的高級(jí)特性。 1....
    LaBaby_閱讀 1,272評(píng)論 0 1
  • 題目1: jQuery 能做什么? 選擇網(wǎng)頁元素改變結(jié)果集元素的操作:取值和賦值元素的操作:移動(dòng)元素的操作:復(fù)制、...
    QQQQQCY閱讀 232評(píng)論 0 1
  • jQuery jQuery就是JS的一個(gè)擴(kuò)展庫,工具庫,提供很多方便快捷的方法,所以將JS對(duì)象轉(zhuǎn)換為jQuery對(duì)...
    YQY_苑閱讀 304評(píng)論 0 1
  • 1、 jQuery 能做什么? jquery是一個(gè)豐富的js庫,內(nèi)部對(duì)js的很多復(fù)雜的方法進(jìn)行了封裝和加工,比如j...
    zh_yang閱讀 1,499評(píng)論 6 13

友情鏈接更多精彩內(nèi)容