jQuery學(xué)習(xí)筆記之基礎(chǔ)中的基礎(chǔ)
1.jQuery的簡(jiǎn)介
就像上節(jié)所將到的Ajax框架一樣,簡(jiǎn)單的說(shuō),jQuery是一個(gè)優(yōu)秀的javascript框架,它能夠讓用戶方便的處理html,events(冒泡)事件,動(dòng)畫效果,ajax交互等,它極大程度的改變了開(kāi)發(fā)者使用javascript的習(xí)慣。jQuery自2006年最初創(chuàng)建,已經(jīng)吸引了眾多的javascript高手加入其團(tuán)隊(duì),隨著事件推移,jQuery新版本一個(gè)一個(gè)發(fā)布,它越來(lái)越受到關(guān)注。
如今,jQuery發(fā)展到集各種javascript/css/dom和ajax功能于一體的強(qiáng)大框架??梢院?jiǎn)單的用代碼實(shí)現(xiàn)各種網(wǎng)頁(yè)效果
目前jQuery主要提供以下功能:
1.訪問(wèn)頁(yè)面框架的局部,這是DOM模型主要的功能之一,DOM有獲取頁(yè)面某個(gè)節(jié)點(diǎn)或者某一類節(jié)點(diǎn)有固定的方法,而jQuery大大簡(jiǎn)化其操作步奏。
2.修改頁(yè)面的表現(xiàn)。css的主要功能就是通過(guò)樣式風(fēng)格來(lái)修改頁(yè)面的表現(xiàn),jquery也很好的解決了眾多瀏覽器對(duì)css3的支持程度,使得各個(gè)瀏覽器都能很好的使用css3標(biāo)準(zhǔn),極大的豐富了css的運(yùn)用。
3.修改頁(yè)面的內(nèi)容。通過(guò)強(qiáng)大的api,jquery可以方便的修改頁(yè)面內(nèi)容,包括文本的內(nèi)容,插入新圖片,表單的選項(xiàng),甚至整個(gè)頁(yè)面框架。
4.響應(yīng)事件。jquery可以方便的處理事件,而且開(kāi)發(fā)人員不再需要討厭瀏覽器的兼容問(wèn)題。
5.為頁(yè)面添加動(dòng)畫。使用javascript添加動(dòng)畫需要大量的代碼,而jquery大大簡(jiǎn)化了此過(guò)程,并且提供了大量可以自定義參數(shù)的動(dòng)畫效果。
6.與服務(wù)器交互。jquery提供一整套ajax的相關(guān)操作,大大方便了異步交互的開(kāi)發(fā)和使用。
7.簡(jiǎn)化常用的javascript操作。jquery提供了很多附加功能來(lái)簡(jiǎn)化常用的javascript操作,例如數(shù)組的操作,迭代運(yùn)算等。
2.jquery的優(yōu)勢(shì)。
以表格隔行變色來(lái)具體說(shuō)明jquery的優(yōu)勢(shì)
i.javascript和jquery實(shí)現(xiàn)的隔行變色
<script type="text/javascript">
window.onload = function() {
var oTable = document.getElementById("mytable");
for (var i = 0;i < oTable.rows.length; i++) {
if (i % 2 == 0)
oTable.rows[i].className = "altcss";
}
}
</script>
利用jquery實(shí)現(xiàn)
<script type="text/javascript">
$(function(){
$("table#mytable tr:nth-child(odd)").addClass("altcss");
})
</script>
表格區(qū)域代碼
<table width="800" cellspacing="0" border="1" id="mytable">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
以上就是本文的全部?jī)?nèi)容了,都是非?;A(chǔ)的東西,高手們請(qǐng)直接略過(guò)。
相關(guān)文章
JQuery中使文本框獲得焦點(diǎn)的方法實(shí)例分析
這篇文章主要介紹了JQuery中使文本框獲得焦點(diǎn)的方法,實(shí)例分析了jQuery針對(duì)文本框獲得焦點(diǎn)的技巧,需要的朋友可以參考下2015-02-02
jquery事件preventDefault()方法用法實(shí)例
這篇文章主要介紹了jquery事件preventDefault()方法用法,實(shí)例分析了preventDefault()方法的功能及使用技巧,需要的朋友可以參考下2015-01-01
基于jquery 的一個(gè)progressbar widge
這個(gè)widget是包含在wijmo 項(xiàng)目中的一個(gè)widget。目前此widget已經(jīng)開(kāi)源基于mit和gpl雙協(xié)議,目前是beta版,可能存在bug。2010-10-10
淺談JQ中mouseover和mouseenter的區(qū)別
下面小編就為大家?guī)?lái)一篇淺談JQ中mouseover和mouseenter的區(qū)別。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。2016-09-09
tuzhu_req.js 實(shí)現(xiàn)仿百度圖片首頁(yè)效果
這篇文章主要介紹了tuzhu_req.js 實(shí)現(xiàn)仿百度圖片首頁(yè)效果的相關(guān)資料,需要的朋友可以參考下2015-08-08
jquery(javascript)自動(dòng)序列編號(hào)和屬性編號(hào)實(shí)現(xiàn)代碼
jquery(javascript)自動(dòng)序列編號(hào)和屬性編號(hào)實(shí)現(xiàn)代碼,需要的朋友可以參考下2012-07-07
jQuery extend()詳解及簡(jiǎn)單實(shí)例
這篇文章主要介紹了jQuery extend()詳解及簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-05-05
jQuery實(shí)現(xiàn)的原圖對(duì)比窗簾效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)的原圖對(duì)比窗簾效果,需要的朋友可以參考下2014-06-06

