摘要:基本概念學(xué)習(xí)目標(biāo)學(xué)會如何使用,掌握的常用,能夠使用實現(xiàn)常見的效果。想要實現(xiàn)簡單的動畫效果,也很麻煩代碼冗余。實現(xiàn)動畫非常簡單,而且功能更加的強大。注意選擇器返回的是對象。
jQuery基本概念
學(xué)習(xí)目標(biāo):學(xué)會如何使用jQuery,掌握jQuery的常用api,能夠使用jQuery實現(xiàn)常見的效果。
為什么要學(xué)習(xí)jQuery?【01-讓div顯示與設(shè)置內(nèi)容.html】
使用javascript開發(fā)過程中,有許多的缺點:
1. 查找元素的方法太少,麻煩。 2. 遍歷偽數(shù)組很麻煩,通常要嵌套一大堆的for循環(huán)。 3. 有兼容性問題。 4. 想要實現(xiàn)簡單的動畫效果,也很麻煩 5. 代碼冗余。jQuery初體驗
【02-讓div顯示與設(shè)置內(nèi)容.html】
$(document).ready(function () { $("#btn1").click(function () { //隱式迭代:偷偷的遍歷,在jQuery中,不需要手動寫for循環(huán)了,會自動進行遍歷。 $("div").show(200); }); $("#btn2").click(function () { $("div").text("我是內(nèi)容"); }); });
優(yōu)點總結(jié):
1. 查找元素的方法多種多樣,非常靈活 2. 擁有隱式迭代特性,因此不再需要手寫for循環(huán)了。 3. 完全沒有兼容性問題。 4. 實現(xiàn)動畫非常簡單,而且功能更加的強大。 5. 代碼簡單、粗暴。什么是jQuery?
jQuery的官網(wǎng) http://jquery.com/
jQuery就是一個js庫,使用jQuery的話,會比使用JavaScript更簡單。
js庫:把一些常用到的方法寫到一個多帶帶的js文件,使用的時候直接去引用這js文件就可以了。(animate.js、common.js)
我們知道了,jQuery其實就是一個js文件,里面封裝了一大堆的方法方便我們的開發(fā),其實就是一個加強版的common.js,因此我們學(xué)習(xí)jQuery,其實就是學(xué)習(xí)jQuery這個js文件中封裝的一大堆方法。
jQuery的入口函數(shù)使用jQuery的三個步驟:
1. 引入jQuery文件 2. 入口函數(shù) 3. 功能實現(xiàn)
關(guān)于jQuery的入口函數(shù):
//第一種寫法 $(document).ready(function() { }); //第二種寫法 $(function() { });
jQuery入口函數(shù)與js入口函數(shù)的對比
1. JavaScript的入口函數(shù)要等到頁面中所有資源(包括圖片、文件)加載完成才開始執(zhí)行。 2. jQuery的入口函數(shù)只會等待文檔樹加載完成就開始執(zhí)行,并不會等待圖片、文件的加載。jQuery對象與DOM對象的區(qū)別(重點)
DOM對象:使用JavaScript中的方法獲取頁面中的元素返回的對象就是dom對象。
jQuery對象:jquery對象就是使用jquery的方法獲取頁面中的元素返回的對象就是jQuery對象。
jQuery對象其實就是DOM對象的包裝集(包裝了DOM對象的集合(偽數(shù)組))
DOM對象與jQuery對象的方法不能混用。
DOM對象轉(zhuǎn)換成jQuery對象:【聯(lián)想記憶:花錢】
var $obj = $(domObj); // $(document).ready(function(){});就是典型的DOM對象轉(zhuǎn)jQuery對象
jQuery對象轉(zhuǎn)換成DOM對象:
var $li = $(“l(fā)i”); //第一種方法(推薦使用) $li[0] //第二種方法 $li.get(0)選擇器 什么是jQuery選擇器
jQuery選擇器是jQuery為我們提供的一組方法,讓我們更加方便的獲取到頁面中的元素。注意:jQuery選擇器返回的是jQuery對象。
jQuery選擇器有很多,基本兼容了CSS1到CSS3所有的選擇器,并且jQuery還添加了很多更加復(fù)雜的選擇器。【查看jQuery文檔】
jQuery選擇器雖然很多,但是選擇器之間可以相互替代,就是說獲取一個元素,你會有很多種方法獲取到。所以我們平時真正能用到的只是少數(shù)的最常用的選擇器。
基本選擇器總結(jié):跟css的選擇器用法一模一樣。
層級選擇器
跟CSS的選擇器一模一樣。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/117275.html
摘要:基本概念學(xué)習(xí)目標(biāo)學(xué)會如何使用,掌握的常用,能夠使用實現(xiàn)常見的效果。想要實現(xiàn)簡單的動畫效果,也很麻煩代碼冗余。實現(xiàn)動畫非常簡單,而且功能更加的強大。注意選擇器返回的是對象。 jQuery基本概念 學(xué)習(xí)目標(biāo):學(xué)會如何使用jQuery,掌握jQuery的常用api,能夠使用jQuery實現(xiàn)常見的效果。 為什么要學(xué)習(xí)jQuery? 【01-讓div顯示與設(shè)置內(nèi)容.html】 使用javasc...
摘要:基本概念學(xué)習(xí)目標(biāo)學(xué)會如何使用,掌握的常用,能夠使用實現(xiàn)常見的效果。想要實現(xiàn)簡單的動畫效果,也很麻煩代碼冗余。實現(xiàn)動畫非常簡單,而且功能更加的強大。注意選擇器返回的是對象。 jQuery基本概念 學(xué)習(xí)目標(biāo):學(xué)會如何使用jQuery,掌握jQuery的常用api,能夠使用jQuery實現(xiàn)常見的效果。 為什么要學(xué)習(xí)jQuery? 【01-讓div顯示與設(shè)置內(nèi)容.html】 使用javasc...
摘要:基本概念學(xué)習(xí)目標(biāo)學(xué)會如何使用,掌握的常用,能夠使用實現(xiàn)常見的效果。想要實現(xiàn)簡單的動畫效果,也很麻煩代碼冗余。實現(xiàn)動畫非常簡單,而且功能更加的強大。注意選擇器返回的是對象。 jQuery基本概念 學(xué)習(xí)目標(biāo):學(xué)會如何使用jQuery,掌握jQuery的常用api,能夠使用jQuery實現(xiàn)常見的效果。 為什么要學(xué)習(xí)jQuery? 【01-讓div顯示與設(shè)置內(nèi)容.html】 使用javasc...
摘要:前言月份開始出沒社區(qū),現(xiàn)在差不多月了,按照工作的說法,就是差不多過了三個月的試用期,準(zhǔn)備轉(zhuǎn)正了一般來說,差不多到了轉(zhuǎn)正的時候,會進行總結(jié)或者分享會議那么今天我就把看過的一些學(xué)習(xí)資源主要是博客,博文推薦分享給大家。 1.前言 6月份開始出沒社區(qū),現(xiàn)在差不多9月了,按照工作的說法,就是差不多過了三個月的試用期,準(zhǔn)備轉(zhuǎn)正了!一般來說,差不多到了轉(zhuǎn)正的時候,會進行總結(jié)或者分享會議!那么今天我就...
閱讀 3564·2023-04-26 00:05
閱讀 953·2021-11-11 16:55
閱讀 3522·2021-09-26 09:46
閱讀 3517·2019-08-30 15:56
閱讀 909·2019-08-30 15:55
閱讀 2933·2019-08-30 15:53
閱讀 1939·2019-08-29 17:11
閱讀 814·2019-08-29 16:52