JS框架 JQuery高階

2022-03-25 04:51:40 字數 1973 閱讀 4708

1. jquery 高階

1. 動畫

2. 遍歷

3. 事件繫結

4. 案例

5. 外掛程式

1. 動畫

1. 三種方式顯示和隱藏元素

1. 預設顯示和隱藏方式

1. show([speed,[easing],[fn]])

1. 引數:

1. speed:動畫的速度。三個預定義的值("slow","normal", "fast")或表示動畫時長的毫秒數值(如:1000)

2. easing:用來指定切換效果,預設是"swing",可用引數"linear"

* swing:動畫執行時效果是 先慢,中間快,最後又慢

* linear:動畫執行時速度是勻速的

3. fn:在動畫完成時執行的函式,每個元素執行一次。

2. hide([speed,[easing],[fn]])

3. toggle([speed],[easing],[fn])

2. 滑動顯示和隱藏方式

1. slidedown([speed],[easing],[fn])

2. slideup([speed,[easing],[fn]])

3. slidetoggle([speed],[easing],[fn])

3. 淡入淡出顯示和隱藏方式

1. fadein([speed],[easing],[fn])

2. fadeout([speed],[easing],[fn])

3. fadetoggle([speed,[easing],[fn]])

2. 遍歷

1. js的遍歷方式

* for(初始化值;迴圈結束條件;步長)

2. jq的遍歷方式

1. jq物件.each(callback)

1. 語法:

jquery物件.each(function(index,element){});

* index:就是元素在集合中的索引

* element:就是集合中的每乙個元素物件

* this:集合中的每乙個元素物件

2. **函式返回值:

* true:如果當前function返回為false,則結束迴圈(break)。

* false:如果當前function返回為true,則結束本次迴圈,繼續下次迴圈(continue)

2. $.each(object, [callback])

3. for..of: jquery 3.0 版本之後提供的方式

for(元素物件 of 容器物件)

3. 事件繫結

1. jquery標準的繫結方式

* jq物件.事件方法(**函式);

* 注:如果呼叫事件方法,不傳遞**函式,則會觸發瀏覽器預設行為。

* 表單物件.submit();//讓表單提交

2. on繫結事件/off解除繫結

* jq物件.on("事件名稱",**函式)

* jq物件.off("事件名稱")

* 如果off方法不傳遞任何引數,則將元件上的所有事件全部解綁

3. 事件切換:toggle

* jq物件.toggle(fn1,fn2...)

* 當單擊jq物件對應的元件後,會執行fn1.第二次點選會執行fn2.....

* 注意:1.9版本 .toggle() 方法刪除,jquery migrate(遷移)外掛程式可以恢復此功能。4. 案例

1. 廣告顯示和隱藏

正文部分

2. **

5. 外掛程式:增強jquery的功能

1. 實現方式:

1. $.fn.extend(object)

* 增強通過jquery獲取的物件的功能 $("#id")

2. $.extend(object)

* 增強jqeury物件自身的功能 $/jquery

學習js中的JQuery框架

jquery的安裝步驟 乙個是壓縮版,將注釋,空格均作了刪除,將變數字元數刪少,產品上線時使用 jquery 3.3.1.min.js 帶min 一 般 我們使用這個 2.將jquery的js檔案拷貝到web的目錄下 放在建立的網頁目錄 3.頁面引用js檔案 jquery的js 4.頁面中載入jqu...

js高階 12 jquery事件彙總

keypress事件只在按下鍵盤的任一 字元鍵 如a z 數字鍵 時觸發,單獨按下 功能鍵 如f1 f12 ctrl鍵 shift鍵 alt鍵等 不會觸發 而keydown無論是按下 字元鍵 還是 功能鍵 都會觸發 event.which 指示按了哪個鍵或按鈕。event.type 描述事件的型別。...

jquery框架 jQuery工具

1.in arra y 2.inarray 2.inarr ay 2.merge 3.un ique 4.unique 4.uniqu e 4.parsejson 5.is arra y 6.isarray 6.isarr ay 6.isfunction 7.is empt yobj ect 8.i...