又到了一年一度的畢業(yè)季了,青春散場,卻等待下一場開幕。
目前成都創(chuàng)新互聯(lián)公司已為成百上千家的企業(yè)提供了網站建設、域名、網站空間、網站托管、服務器托管、企業(yè)網站設計、靖江網站維護等服務,公司將堅持客戶導向、應用為本的策略,正道將秉承"和諧、參與、激情"的文化,與客戶和合作伙伴齊心協(xié)力一起成長,共同發(fā)展。
在求職大軍中,IT行業(yè)的程序員、碼農是工科類大學生的熱門選擇之一,
尤其是近幾年Web的如火如荼,更是吸引了成千上萬的程序員投身其中追求自己的夢想,
這篇文章以Web面試官的經歷整理而成,希望能對你有所幫助。
jQuery是javascript編寫一個可重用的JavaScript庫。
不使用jQuery設置UI文本的JavaScript代碼如下:
document.getElementById("txt1").value = "hello";
用jQuery類庫后的的JavaScript代碼如下:
$("#txt1").val("Hello");
可見,在使用JQuery類庫后的JavaScript代碼明顯簡潔了很多,也更符合IT行業(yè)特點:短、平、快。
JavaScript:是一門Web最流行的腳本語言。
jQuery: 是一個優(yōu)秀的Javascript框架。它是輕量級的js庫 ,它兼容CSS3,還兼容各種瀏覽器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。
故,jQuery是并不是要取代的JavaScript;使用JQuery使Web開發(fā)變得簡單。
從jquery.com下載的jquery.js文件(最新的JQuery版本V1.11.1或V2.1.1)。 jQuery的文件規(guī)則,如“jquery-1.4.1.j s”,其中1.4.1是JS文件的版本的版本號。
在開發(fā)Web程序前,需要包含的JavaScript,如圖下面的代碼:
在開發(fā)Web頁面,考慮最多的問題之一是頁面在客戶端電腦的響應:時間越短,用戶體驗越好。
而制約用戶體驗的關鍵因素之一是瀏覽器下載Web文件大小,包括*.html、圖片、*.js、*.css等文件。
為了最大化復用和節(jié)約帶寬,故CDN應運而生:其基本思路是盡可能避開互聯(lián)網上有可能影響數(shù)據(jù)傳輸速度和穩(wěn)定性的瓶頸和環(huán)節(jié),使內容傳輸?shù)母?、更穩(wěn)定。其目的是使用戶可就近取得所需內容,解決 Internet網絡擁擠的狀況,提高用戶訪問網站的響應速度。
推薦使用官方的CDN節(jié)點,使用代碼如下:
還有Google提供的JQuery CDN:
同時微軟也提供了JQuery CDN的節(jié)點:
一般情況下,CDN網絡節(jié)點是可靠的。
但是偶爾也有失靈的時候,故為了提供雙保險,可進行判斷網絡加載CDN失敗,則自動加載網站上的JQuery
, 示例代碼如下:
相同:
這兩個文件提供相同的jQuery的功能,即在函數(shù)調用上沒有區(qū)別。
不同:
JQuery.js文件,適合讓程序員閱讀,如下圖所示:
JQuery.min.js文件,通過壓縮和刪除所有的空格,以節(jié)省帶寬和空間,使得文件更小,用于網絡傳輸,不適合程序員閱讀。
開發(fā)調試場景下:用jQuery.js文件,因為你想調試,能夠看到javascript代碼。
生產部署環(huán)境下:用jQuery.min.js文件,可減少網絡寬度,加快網頁加載速度。
*.vsdoc.js文件是用來在微軟的開發(fā)環(huán)境Visual Studio下使用的,方便得獲得jQuery的智能感知,當你輸入jQuery函授后,會自動提示函數(shù)的類型、函數(shù)使用說明、函數(shù)參數(shù)等等。
如果在VS下用jQuery開發(fā)Web程序,則vsdoc.js文件會大大的提高開發(fā)效率。
jQuery的語法結構可以分為四部分:
默認情況下,所有Jquery的命令開始以一個“$”符號。
其次是HTML元素的選擇。例如下面是我們通過ID“txt1”選擇一個HTML文本框。
接著由點(.)分隔。這個操作者將分離的元素和該元素的動作(函數(shù))。
最后什么樣的函數(shù)(動作)。
例如在下面的jQuery代碼,我們正在設置的文本值為“Hello world, jQuery”。
在jQuery中,“$”符號是一個jQuery的別名,默認的jQuery類庫以$開頭。
有很多類似jQuery一樣的類庫,如MooTools, Backbone, Sammy, Cappuccino, Knockout 。這些類庫中,有的也使用了$符號,如果同時使用,則會導致命名沖突。
為了解決這個沖突,需要用到jQuery.noConflict(),這樣就不依賴$這個默認符號了。
例如:
$.noConflict(); jQuery("p").text("I am jquery and I am working…");
或者使用別名代替:
var jq = $.noConflict(); jq("p").text("I am invoked using jquery shortcut…");
選擇所有HTML的p元素,并隱藏
$("p").hide();
選擇ID為Text1的HTML元素,并賦值
$("#Text1").val("Hello");
選擇Class為Text1dHTML元素,并賦值
$(".Text1").val("Hello");
一次完整的HTML DOM加載完成,會觸發(fā)HTML的“document.ready”事件,而要通過jQuery訪問HTML元素,則需要頁面的HTML元素加載完成。
例如:
而在Ready事件中的可訪問HTML元素,例子如下:
可以。
下面通過2個例子來說明
例子1,選擇所有的button元素,在其click事件中,對所有p元素進行toggle。
$("button").click(function(){ $("p").toggle(); });
例子2,選擇ID為p1的元素,在mouseenter事件中,進行alert。
$("#p1").mouseenter(function(){ alert("You entered p1!"); });
使用例子如下:
$("li").filter(".middle").addClass("selected");
css樣式內容如下: