天天看點

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

1.$和jquery在全局命名空間中定義的唯一兩個變量。

2.jquery是工廠函數,不是構造函數。他傳回一個新建立的對象。

3.jquery的四種調用方式:

    <1>傳遞css選擇器(字元串)給$()方法

    <2>傳遞element,document或window對象給$()方法

    <3>傳遞html文本字元串給$()方法。

    如:

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]
JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

    <4>傳入一個函數給$()方法。

4.jquery函數

   是jquery或$的值。該函數可以用來建立jquery對象,用來注冊dom就緒時需要調用的處理函數。

<1>jquery對象

    jquery對象是由jquery函數傳回的對象。

<2>jquery方法

    jquery方法是由jquery函數傳回的jquery對象的方法。

例子:

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

5.

    <1>jquery對象是類數組

    <2>其他三個屬性

    $(參數一,參數二,參數三)

    參數一:選擇器

    參數二:content屬性是上下文對象,如果沒傳遞的話,就是document對象

    參數三:名為jquery的屬性

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

   <3>

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

prepend()    

在元素的前面添加内容,依舊在标簽内部。

回調函數是什麼?

<4>jquery的幾個基礎方法

jquery的map()方法

jquery的each()方法

jquery的is()方法

6.jquery的setter與getter

7.jquery

css(),attr(),addclass()等jquery的setter方法都可以傳遞多個名值對設定屬性,還有函數設定屬性。

offset()擷取偏移量相對于文檔

position()擷取偏移量相對于父元素

8.jquery擷取元素的寬高問題(有趣)

width(),height():擷取的是内容的寬高(不包括内邊距,邊框,外邊距)

innerwidth(),innerheight():擷取的是包括内邊距的寬高

outerwidth(),outerheight():擷取的是包括内邊距,邊框的寬高

outerwidth(true),outerheight(true):擷取的是包括内邊距,邊框,外邊距的寬高

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

9.擷取和設定元素資料(重要)

jquery定義了一個名為data()的getter/setter方法,可用來設定或擷取與文檔元素,document或window對象相關聯的資料。可以将資料與任意元素關聯。這也是jquery的事件處理程式注冊和效果隊列機制的基礎。

10.clone()

clone() 方法生成被選元素的副本,包含子節點、文本和屬性。

11.replacewidth()與replaceall()

這兩者差別在于:replaceall()不能使用函數替換

12.包裹元素warp()餘unwarp()

13.remove()與detach(),filter()

14.jquery事件對象

jquery通過定義自己的event對象來隐藏浏覽器之間的實作差異。

15.bind()的進階特性之事件的注冊

<1>文法:$(selector).bind(event,data,function)

<2>bind()有三個參數:

參數一:事件類型字元串,空格分隔多個事件

參數二:傳遞到函數的額外資料。

參數三:處理程式函數

<3>

特性一:bind的一個重要特性是允許為注冊的事件處理程式指定命名空間。

如:

特性二:bind的第一個參數可以是一個對象

與bind()綁定一樣的還有one()也可以綁定事件。

16.unbind()之事件的解除

<1>登出命名空間下的處理程式

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]
JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

17.事件觸發

trigger()

18.實時事件(依賴于冒泡)

delegate()

19.動畫(animate)

<1>禁用動畫:

jquery.fx.off=true;

動畫速度:

fast->200ms

slow->600ms

自定義動畫速度:

jquery.fx.speeds["med-fast"]=300;

<2>jquery動畫是異步的。預設是隊列化的。

當然我們也可以将他們不隊列化。

這個效果就是:fadein與fadeout是隊列化的。animate是非隊列化的。

fadein與animate開始時間相同,

而fadeout會在fadein完成時立即開始。

<3>緩動動畫

自定義緩動動畫:

jquery.easing["squr"]=math.sqrt;

<4>動畫取消(stop),延遲(delay)和隊列

20.jquery的ajax

<1>jquery的load()

$("img").load(function(){   })一個是事件方法

$("img").load('a.txt')一個是ajax方法

具體調用哪個通過後面的參數決定。

post與get有和差別?

<2>jquery.getscript()

動态異步加載腳本檔案,它能同時适用于同源和跨源腳本的加載。

适用:

jquery.getscript("http://eaxo.com/js/wpsl.js",function(){

    //調用且執行完畢後執行回調

})

=>等同于

mime是什麼?jsonp?

<3>jquery.getjson()

<4>jquery.get()和jquery.post()

<5>

jquery.browser

jquery.contains()

jquery.each()

jquery.extend()

21.jquery的插件擴充

關鍵點:jquery.fn是所有jquery對象的原型對象。

如果給該對象添加一個函數,該函數會成為一個jquery方法。

一些插件約定:

JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]
JavaScript權威設計--jQuery,Ajax.animate,SVG(簡要學習筆記二十)[完結篇]

 轉載:http://www.cnblogs.com/zqzjs/p/4896114.html

繼續閱讀