jQuery的優(yōu)勢(shì):
我們提供的服務(wù)有:成都網(wǎng)站建設(shè)、成都網(wǎng)站制作、微信公眾號(hào)開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、新華ssl等。為1000多家企事業(yè)單位解決了網(wǎng)站和推廣的問(wèn)題。提供周到的售前咨詢和貼心的售后服務(wù),是有科學(xué)管理、有技術(shù)的新華網(wǎng)站制作公司
1、輕量級(jí)。jQuery非常輕巧,采用UglifyJS()壓縮后,大小保持在30KB左右。
2、強(qiáng)大的選擇器。
允許開發(fā)者使用從CSS1-CSS3幾乎所有的選擇器,以及jQuery獨(dú)創(chuàng)的高級(jí)而復(fù)雜的選擇權(quán)。
3、出色的DOM操作的封裝。
jQuery封裝了大量常用的DOM操作,使開發(fā)者在編寫DOM操作相關(guān)程序的時(shí)候,更得心應(yīng)手。
4、可靠的事件處理機(jī)制
5、完善的Ajax
jQuery將所有的Ajax操作封裝到一個(gè)函數(shù)$.ajax()里,使得開發(fā)者處理Ajax的時(shí)候能夠?qū)P奶幚順I(yè)務(wù)邏輯而無(wú)需關(guān)心復(fù)雜的瀏覽器兼容性和XMLHttpRequest對(duì)象的創(chuàng)建和使用的問(wèn)題。
6、不污染頂級(jí)變量。
7、出色的瀏覽器兼容性
8、鏈?zhǔn)讲僮鞣绞?/p>
對(duì)發(fā)生在同一個(gè)jQuery對(duì)象上的操作,可以直接連寫而無(wú)重復(fù)獲取對(duì)象。
9、隱式迭代
當(dāng)想找到帶有“.myclass”類的全部元素,并將其隱藏,無(wú)需循環(huán)遍歷每一個(gè)返回的元素。
10、行為層與結(jié)構(gòu)層的分離
開發(fā)者可以使用jQuery選擇器選中元素,然后直接給元素添加事件。使各個(gè)方面的開發(fā)人員各司其職,互不干涉。
11、豐富的插件支持
12、完善的文檔
13、開源
用處:jquery是基于javascript類庫(kù)的框架, 它里面提供了許多javascript類庫(kù),和一些css樣式表的封裝, 使用起來(lái)比較方便, 簡(jiǎn)化了用戶與瀏覽器的交互, 提高了系統(tǒng)的性能和開發(fā)效率。
jQuery設(shè)計(jì)的宗旨是“write Less,Do More”,即倡導(dǎo)寫更少的代碼,做更多的事情。它封裝JavaScript常用的功能代碼,提供一種簡(jiǎn)便的JavaScript設(shè)計(jì)模式,優(yōu)化HTML文檔操作、事件處理、動(dòng)畫設(shè)計(jì)和Ajax交互。
jQuery的核心特性可以總結(jié)為:具有獨(dú)特的鏈?zhǔn)秸Z(yǔ)法和短小清晰的多功能接口;具有高效靈活的css選擇器,并且可對(duì)CSS選擇器進(jìn)行擴(kuò)展;擁有便捷的插件擴(kuò)展機(jī)制和豐富的插件。jQuery兼容各種主流瀏覽器,如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。
擴(kuò)展資料:
語(yǔ)言特點(diǎn)
1、快速獲取文檔元素
jQuery的選擇機(jī)制構(gòu)建于Css的選擇器,它提供了快速查詢DOM文檔中元素的能力,而且大大強(qiáng)化了JavaScript中獲取頁(yè)面元素的方式。
2、提供漂亮的頁(yè)面動(dòng)態(tài)效果
jQuery中內(nèi)置了一系列的動(dòng)畫效果,可以開發(fā)出非常漂亮的網(wǎng)頁(yè),許多網(wǎng)站都使用jQuery的內(nèi)置的效果,比如淡入淡出、元素移除等動(dòng)態(tài)特效。
3、創(chuàng)建AJAX無(wú)刷新網(wǎng)頁(yè)
AJAX是異步的JavaScript和ML的簡(jiǎn)稱,可以開發(fā)出非常靈敏無(wú)刷新的網(wǎng)頁(yè),特別是開發(fā)服務(wù)器端網(wǎng)頁(yè)時(shí),比如PHP網(wǎng)站,需要往返地與服務(wù)器通信,如果不使用AJAX,每次數(shù)據(jù)更新不得不重新刷新網(wǎng)頁(yè),而使用AJAX特效后,可以對(duì)頁(yè)面進(jìn)行局部刷新,提供動(dòng)態(tài)的效果。
參考資料來(lái)源:百度百科--jQuery
本文實(shí)例講述了jQuery旋轉(zhuǎn)插件jqueryrotate用法。分享給大家供大家參考,具體如下:
CSS3
提供了多種變形效果,比如矩陣變形、位移、縮放、旋轉(zhuǎn)和傾斜等等,讓頁(yè)面更加生動(dòng)活潑有趣,不再一動(dòng)不動(dòng)。然后
IE10
以下版本的瀏覽器不支持
CSS3
變形,雖然
IE
有私有屬性濾鏡(filter),但不全面,而且效果和性能都不好。
今天介紹一款
jQuery
插件——jqueryrotate,它可以實(shí)現(xiàn)旋轉(zhuǎn)效果。jqueryrotate
支持所有主流瀏覽器,包括
IE6。如果你想在低版本的
IE
中實(shí)現(xiàn)旋轉(zhuǎn)效果,那么
jqueryrotate
是一個(gè)很好的選擇。
兼容性
jqueryrotate
支持所有主流瀏覽器,包括
IE6。jqueryrotate
在高級(jí)瀏覽器中使用
CSS3
transform
屬性實(shí)現(xiàn),在低版本
IE
中使用
VML
實(shí)現(xiàn)。當(dāng)然,你可以使用
IE
條件注釋,低版本
IE
使用
jqueryrotate,高級(jí)瀏覽器則直接使用
CSS3。
使用方法
//演示1
//旋轉(zhuǎn)45angle
$(document.body).click(function
()
{
//方式1
$('.divOne').rotate(45);
//方式2
$('.divOne').rotate({
angle:
45
});
});
//演示2
//鼠標(biāo)移動(dòng)效果
//方式1
$('.divOne').rotate({
bind:
{
mouseover:
function
()
{
$(this).rotate({
animateTo:
180
});
},
mouseout:
function
()
{
$(this).rotate({
animateTo:
});
}
}
});
//方式2
$('.divOne').mouseover(function
()
{
$(this).rotate({
animateTo:
180
});
}).mouseout(function
()
{
$(this).rotate({animateTo:0});
});
//演示3
不停旋轉(zhuǎn)
//方式1
var
angle
=
0;
setInterval(function
()
{
angle
+=
3;
$('.divOne').rotate(angle);
},
50);
//方式2
var
rotation
=
function
()
{
$('.divOne').rotate({
angle:
0,
animateTo:
360,
callback:rotation
})
}
rotation();
//方式3
var
rotation
=
function
()
{
$('.divOne').rotate({
angle:
0,
animateTo:
360,
callback:
rotation,
easing:
function
(x,
t,
b,
c,
d)
{
return
c
*
(t
/
d)
+
b;
}
})
}
rotation();
//演示4
點(diǎn)擊旋轉(zhuǎn)
//方式1
$('.divOne').click(function
()
{
$(this).rotate({
angle:
0,
animateTo:
180,
easing:
$.easing.easeInOutExpo
});
});
var
val
=
0;
$('.divOne').click(function
()
{
val
+=
90;
$(this).rotate({
animateTo:
val
});
});
參數(shù)
參數(shù)
類型
說(shuō)明
默認(rèn)值
angle
數(shù)字
旋轉(zhuǎn)一個(gè)角度
animateTo
數(shù)字
從當(dāng)前的角度旋轉(zhuǎn)到多少度
step
函數(shù)
每個(gè)動(dòng)畫步驟中執(zhí)行的回調(diào)函數(shù),當(dāng)前角度值作為該函數(shù)的第一個(gè)參數(shù)
無(wú)
easing
函數(shù)
自定義旋轉(zhuǎn)速度、旋轉(zhuǎn)效果,需要使用
jQuery.easing.js
無(wú)
duration
整數(shù)
旋轉(zhuǎn)持續(xù)時(shí)間,以毫秒為單位
callback
函數(shù)
旋轉(zhuǎn)完成后的回調(diào)函數(shù)
無(wú)
getRotateAngle
函數(shù)
返回旋轉(zhuǎn)對(duì)象當(dāng)前的角度
無(wú)
stopRotate
函數(shù)
停止旋轉(zhuǎn)
無(wú)
演示雖然使用的是圖片,但
jqueryrotate
并不只是能運(yùn)用在圖片上,其他元素如
div
等也可以使用。同時(shí),你可以發(fā)揮想象,制作出更多關(guān)于旋轉(zhuǎn)的特效。
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jQuery窗口操作技巧總結(jié)》、《jQuery拖拽特效與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jquery中Ajax用法總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見(jiàn)經(jīng)典特效匯總》、《jQuery動(dòng)畫與特效用法總結(jié)》及《jquery選擇器用法總結(jié)》
希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。