|
今天是劉小愛自學Java的第84天。 感謝你的觀看，謝謝你。 話不多說，繼續(xù)前端的學習：  jQuery是一個框架，在學jQuery之前可以先思考一個問題：如何去理解框架？ 其實從某種意義上來說就是代碼的封裝。 對于使用者來說只需要調(diào)用框架里的方法或?qū)傩詫崿F(xiàn)某種功能即可。 至于具體是如何實現(xiàn)的？使用者不用管，框架里面會實現(xiàn)。 所以一般情況下，框架編寫的越復雜，其使用也就越簡單。 一、自定義js文件既然有現(xiàn)成的框架可以用，為何還要自定義？ 很簡單，學習階段，知其然也要知其所以然，先看下面的代碼：  代碼實現(xiàn)的功能也很簡單： 給div標簽添加了一個內(nèi)容：“劉小愛”；給a便簽添加了一個超鏈接。 也就是昨天剛學的DOM編程，其中涉及到getElementById()方法的使用。 那么現(xiàn)在問題來了： 如果一個html中需要用到很多次這樣的功能，該方法要使用很多遍。 既然如此，為何不將該方法封裝起來？  ①自定義一個js文件 將getElementById()封裝到一個js方法里面，并且在js中使用$代替該方法名。 這樣在使用時直接使用$即可，都不用記方法名，特別的方便。 ②使用自定義的js文件 先在HTML中導入對應的js文件路徑，再使用： 現(xiàn)在使用的時候，就直接用美元符號$＋對應參數(shù)即可，特別的簡便。 那么現(xiàn)在問題又來了： 上述舉的例子只是說到了根據(jù)id獲取元素的方法，也就是getElementById()。 如果是標簽名，類名就沒法使用了。那如何解決這個問題？ 前幾天學CSS的時候，它是使用各種選擇器來定位對應的標簽的。 同樣的道理，在$符號中填入對應的“選擇器”參數(shù)，即可獲取對應的標簽元素。 當然其具體如何實現(xiàn)的還不清楚，反正jQuery框架確實能實現(xiàn)該功能。 二、jQuery框架網(wǎng)上搜索jQuery下載，即可下載到各個版本的jQuery。  版本從1.11.1到3.5.1不等，不過版本不一定越新越好，看實際需求。百度用的jQuery版本還是1點幾呢。 并且要知道XP都出來近20年了，還不是有很多公司很多人用XP系統(tǒng)。 既然如此，那我還是用最新版3.5.1吧。 導入jQuery就不再詳細闡述了。 直接創(chuàng)建一個js包，將下載的jQuery庫放進js包，再導入對應路徑即可。 然后就可以直接使用jQuery了：  ①js和jQuery方法區(qū)別 jQuery和js都有自己特有的操作方法。比如對于標簽文本的修改：
兩者之間不能弄混，只能各自用自己的。 ②jQuery的兩種使用方式 根據(jù)id修改對應標簽的內(nèi)容，#myDiv2是id選擇器。 jQuery（“#myDiv2”）可以獲取對應標簽。 $(“#myDiv3”)也可以獲取對應id標簽。 這兩種方法其實是一回事，說白了其底層封裝的時候就是“$$代替了jQuery這個方法名。 三、jQuery與js之間的轉(zhuǎn)換jQuery對象和js對象之間是可以互相轉(zhuǎn)換的。 如何判斷它們之間完成了轉(zhuǎn)換？ 它們各自有自己特有的API，就是對于初學者來說，特容易將它們的方法弄混。  ②jQuery對象轉(zhuǎn)換成js對象 通過jQuery("#myDiv1")獲取的就是jQuery對象，這不用多說。 那如何將其轉(zhuǎn)換成js對象？ jq[0]可以調(diào)用js的API，所以jq[0]就是已經(jīng)被轉(zhuǎn)換成js對象了。 jQuery對象其實是一個js對象數(shù)組，所以可以直接通過索引來取js對象。 為何是數(shù)組？這也好理解： 比如說這里是用的id選擇器，自然只有一個js對象了，jq[0]也就是js對象了。 如果使用的是標簽選擇器呢？獲取的就是很多個js對象，也就是js數(shù)組了。 ③js對象轉(zhuǎn)換成jQuery對象 通過document.getElementById("myDiv2")獲取的也就是js對象，這不用多說。 那如何將js對象轉(zhuǎn)換成jQuery對象？ 直接使用$(js)便可將js對象轉(zhuǎn)換成jQuery對象。 以上便是js和jQuery之間的轉(zhuǎn)換，其中頁面加載事件它們之間也能轉(zhuǎn)換。  ①js方式的加載事件 window.onload這就是一個加載事件。 再將該事件和后面的匿名函數(shù)聯(lián)系起來。 也就是說要等到頁面加載完成之后，再執(zhí)行加載事件對應的函數(shù)。 如果是使用js方式的加載事件，那么后面的加載事件會覆蓋掉前面的加載事件。 所以運行結果第一個div標簽的內(nèi)容才沒有被修改。 ②jQuery方式的加載事件 其格式為：$(function(){})。也就是jQuery方法中參數(shù)即為一個匿名函數(shù) 使用這種方式的話就不會出現(xiàn)覆蓋現(xiàn)象了，無論多少個加載事件都行。 其實也好理解。jQuery方法對其的處理是將function(){}作為window.onload中匿名函數(shù)的一個參數(shù)。 所以無論多少個$(function(){})，其對應的都是同一個加載事件（window.onload），只是參數(shù)不同。 最后謝謝你的觀看。 如果可以的話，麻煩幫忙點個贊，謝謝你。 |
|
|
