全黄H全肉细节文NP,边做边爱播放3免费观看,av色天堂2018在线观看

　　翻譯整理：Young.J
　　官方網(wǎng)站：http://jquery.com

　　jQuery是一款同prototype一樣優(yōu)秀js開發(fā)庫(kù)類，特別是對(duì)css和XPath的支持，使我們寫js變得更加方便！如果你不是個(gè)js高手又想寫出優(yōu) 秀的js效果，jQuery可以幫你達(dá)到目的！
　　下載地址：

　　Starterkit （http://jquery.bassistance.de/jquery-starterkit.zip）
　　jQuery Downloads （http://jquery.com/src/）

　　下載完成后先加載到文檔中，然后我們來(lái)看個(gè)簡(jiǎn)單的例子！

　　一：核心部分
　　$(expr)
　　說(shuō)明：該函數(shù)可以通過(guò)css選擇器，Xpath或html代碼來(lái)匹配目標(biāo)元素，所有的jQuery操作都以此為基礎(chǔ)
　　參數(shù)：expr：字符串，一個(gè)查詢表達(dá)式或一段html字符串
　　例子：
　　未執(zhí)行jQuery前：

<div>

</div>
    <p>three</p>
    <a href="#" id="test" onClick="jq()" >jQuery</a>　　二：DOM操作
　　屬性
　　我們以<img id="a" scr="5.jpg"/>為例，在原始的Javascript里面可以用var o=document.getElementById('a')取的id為a的節(jié)點(diǎn)對(duì)象，在用o.src來(lái)取得或修改該節(jié)點(diǎn)的scr屬性，在jQuery里$("#a")將得到j(luò)Query對(duì)象[ <img id="a" scr="5.jpg"/> ]，然后可以用jQuery提供的很多方法來(lái)進(jìn)行操作，如$("#a").scr()將得到5.jpg,$("#a").scr("1.jpg")將該對(duì)象src屬性改為1,jpg。下面我們來(lái)講jQuery提供的眾多jQuery方法，方便大家快速對(duì)DOM對(duì)象進(jìn)行操作
　　herf()   herf(val)
　　說(shuō)明：對(duì)jQuery對(duì)象屬性herf的操作。
　　例子：
　　未執(zhí)行jQuery前<a href="1.htm" id="test" onClick="jq()">jQuery</a>

三：CSS操作
傳統(tǒng)Javascript對(duì)css的操作相當(dāng)繁瑣，比如<div id="a"style="background:blue">css</div>取它的background語(yǔ)法是document.getElementById("a").style.background，而jQuery對(duì)css更方便的操作，$("#a").background()，$("#a").background(“red”)
$("#a")得到j(luò)Query對(duì)象[ <div id="a"…/div> ]
$("#a").background()將取出該對(duì)象的background樣式。
$("#a").background(“red”)將該對(duì)象的background樣式設(shè)為redjQuery提供了以下方法，來(lái)操作css
background ()   background (val)     color()    color(val)     css(name)    css(prop)
css(key,value)      float()   float(val)   height()   height(val) width() width(val)
left()   left(val)       overflow()   overflow(val)   position()   position(val) top()   top(val)
這里需要講解一下css(name) css(prop) css(key,value)，其他的看名字都知道什么作用了！

css(name) 獲取樣式名為name的樣式
$("#a").css("color")將得到樣式中color值red，("#a").css("background ")將得到blue

css(prop) prop是一個(gè)hash對(duì)象，用于設(shè)置大量的css樣式
$("#b").css({ color: "red", background: "blue"});
最終效果是<p id="b" style="background:blue; color:red">test</p>,{color: "red", background: "blue"}，hash對(duì)象，color為key，"red"為value，

css(key,value) 用于設(shè)置一個(gè)單獨(dú)得css樣式
$("#b").css("color","red");最終效果是<p id="b" style="color:red">test</p>

四：JavaScript處理
$.browser() 判斷瀏覽器類型，返回boolen值

$(function(){
    if($.browser.msie) {
        alert("這是一個(gè)IE瀏覽器");}
    else if($.browser.opera) {
        alert("這是一個(gè)opera瀏覽器");}
})

當(dāng)頁(yè)面載入式判斷瀏覽器類型，可判斷的類型有msie、mozilla、opera、safari

$.each(obj, fn) obj為對(duì)象或數(shù)組，fn為在obj上依次執(zhí)行的函數(shù)，注意區(qū)分$().each()

$.each( [0,1,2], function(i){ alert( "Item #" + i + ": " + this ); }); 分別將0，1，2為參數(shù)，傳入到function(i)中

$.each({ name: "John", lang: "JS" }, function(i){ alert( "Name: " + i + ", Value: " + this ); { name: "John", lang: "JS"}為一個(gè)hash對(duì)象，依次將hash中每組對(duì)象傳入到函數(shù)中

$.extend(obj, prop) 用第二個(gè)對(duì)象擴(kuò)展第一個(gè)對(duì)象

$(function(){
       var settings = { validate: false, limit: 5, name: "foo" };
        var options = { validate: true, name: "bar" };
        $.extend(settings, options);
        $.each(settings,  function(i){ alert( i + "=" + this ); });
})
$.grep(array,fn) 通過(guò)函數(shù)fn來(lái)過(guò)濾array，將array中的元素依次傳給fn，fn必須返回一個(gè)boolen，如fn返回true，將被過(guò)濾

$(function(){
var arr= $.grep( [0,1,2,3,4], function(i){ return i > 2; });
$.each(arr, function(i){ alert(i); });
})我們可以看待執(zhí)行$.grep后數(shù)組[0,1,2,3,4]變成[0，1]

$.merge(first, second) 兩個(gè)參數(shù)都是數(shù)組，排出第二個(gè)數(shù)組中與第一個(gè)相同的，再將兩個(gè)數(shù)組合并

$(function(){
var arr = $.merge( [0,1,2], [2,3,4] )
$.each(arr, function(i){ alert(i); });
})可以看出arr的結(jié)果為[0,1,2,3,4]

$.trim(str) 移出字符串兩端的空格
$.trim(" hello, how are you? ")的結(jié)果是"hello, how are you?"

五：動(dòng)態(tài)效果
在將這部分之前我們先看個(gè)例子，相信做網(wǎng)頁(yè)的朋友都遇到n級(jí)菜單的情景，但點(diǎn)擊某菜單按鈕時(shí)，如果它的子菜單是顯示的，則隱藏子菜單，如果子菜單隱藏，則顯示出來(lái)，傳統(tǒng)的Javascript做法是先用getElementById取出子菜單所在容器的id，在判斷該容器的style.display是否等于none，如果等于則設(shè)為block,如果不等于這設(shè)為none，如果在將效果設(shè)置復(fù)雜一點(diǎn)，當(dāng)點(diǎn)擊按鈕時(shí)，不是忽然隱藏和顯示子菜單，而是高度平滑的轉(zhuǎn)變，這時(shí)就要通過(guò)setTimeout來(lái)設(shè)置子菜單的height了，再?gòu)?fù)雜一點(diǎn)透明度也平滑的消失和顯現(xiàn)，這時(shí)顯現(xiàn)下來(lái)需要編寫很多代碼，如果js基礎(chǔ)不好的朋友可能只能從別人寫好的代碼拿過(guò)來(lái)修改了！jQuery實(shí)現(xiàn)上面效果只需要1句話就行，$("#a").toggle("slow"),,學(xué)完jQuery后還需要抄襲修改別人的代碼嗎？下面我們逐個(gè)介紹jQuery用于效果處理的方法。

hide() 隱藏匹配對(duì)象

<p id="a">Hello Again</p><a href="#" onClick=’ ("#a").hide()’>jQuery</a>

當(dāng)點(diǎn)擊連接時(shí),id為a的對(duì)象的display變?yōu)閚one。

show() 顯示匹配對(duì)象

hide(speed) 以一定的速度隱藏匹配對(duì)象，其大?。ㄩL(zhǎng)寬）和透明度都逐漸變化到0，speed有3級(jí)("slow","normal", "fast")，也可以是自定義的速度。

show(speed) 以一定的速度顯示匹配對(duì)象，其大?。ㄩL(zhǎng)寬）和透明度都由0逐漸變化到正常

hide(speed, callback) show(speed, callback) 當(dāng)顯示和隱藏變化結(jié)束后執(zhí)行函數(shù)callback

toggle() toggle(speed) 如果當(dāng)前匹配對(duì)象隱藏，則顯示他們，如果當(dāng)前是顯示的，就隱藏，toggle(speed),其大?。ㄩL(zhǎng)寬）和透明度都隨之逐漸變化。

<img src="1.jpg" style="width:150px"/>
<a href="#" onClick='$("img").toggle("slow")'>jQuery</a>
fadeIn(speeds) fadeOut(speeds) 根據(jù)速度調(diào)整透明度來(lái)顯示或隱藏匹配對(duì)象，注意有別于hide(speed)和show(speed)，fadeIn和fadeOut都只調(diào)整透明度，不調(diào)整大小

<img src="1.jpg" style="display:none"/><a href="#" onClick='$("img ").fadeIn("slow")'> jQuery </a>點(diǎn)擊連接后可以看到圖片逐漸顯示。

fadeIn(speed, callback) fadeOut(speed, callback) callback為函數(shù)，先通過(guò)調(diào)整透明度來(lái)顯示或隱藏匹配對(duì)象，當(dāng)調(diào)整結(jié)束后執(zhí)行callback函數(shù)

<img src="1.jpg"/>
<a href="#" onClick='$("img ").fadeIn("slow",function(){ alert("Animation Done."); })'> jQuery </a>點(diǎn)擊連接后可以看到圖片逐漸顯示,顯示完全后彈出對(duì)話框

fadeTo(speed, opacity, callback) 將匹配對(duì)象以speed速度調(diào)整倒透明度opacity，然后執(zhí)行函數(shù)callback。Opacity為最終顯示的透明度(0-1).

<img src="1.jpg"/><br>
<a href="#" onClick='$("img ").fadeTo("slow",0.55,function(){ alert("Animation Done."); })'> jQuery </a>大家可以看一下自己看看效果，如果不用jQuery，編寫原始Javascript腳本可能很多代碼！

slideDown(speeds) 將匹配對(duì)象的高度由0以指定速率平滑的變化到正常！

<img src="1.jpg" style="display:none"/>
<a href="#" onClick='$("img ").slideDown("slow")'>jQuery</a>
slideDown(speeds,callback) 將匹配對(duì)象的高度由0變化到正常！變化結(jié)束后執(zhí)行函數(shù)callback

slideUp("slow") slideUp(speed, callback) 匹配對(duì)象的高度由正常變化到0

slideToggle("slow") 如果匹配對(duì)象的高度正常則逐漸變化到0，若為0，則逐漸變化到正常

六：事件處理
hover(Function, Function) 當(dāng)鼠標(biāo)move over時(shí)觸發(fā)第一個(gè)function，當(dāng)鼠標(biāo)move out時(shí)觸發(fā)第二個(gè)function
樣式：<style>.red{color:#FF0000}</style>
Html代碼：<div id="a">sdf</div>
jQuery代碼及效果

$(function(){
  $("#a").hover(function(){$(this).addClass("red");},
                            function(){ $(this).removeClass("red");
                          });
})

最終效果是當(dāng)鼠標(biāo)移到id為a的層上時(shí)圖層增加一個(gè)red樣式，離開層時(shí)移出red樣式

toggle(Function, Function) 當(dāng)匹配元素第一次被點(diǎn)擊時(shí)觸發(fā)第一個(gè)函數(shù)，當(dāng)?shù)诙伪稽c(diǎn)擊時(shí)觸發(fā)第二個(gè)函數(shù)
樣式：<style>.red{color:#FF0000}</style>
Html代碼：<div id="a">sdf</div>
jQuery代碼及效果

$(function(){
  $("#a"). toggle (function(){$(this).addClass("red");},
                              function(){ $(this).removeClass("red");
                            });
})最終效果是當(dāng)鼠標(biāo)點(diǎn)擊id為a的層上時(shí)圖層增加一個(gè)red樣式，離開層時(shí)移出red樣式

bind(type, fn)   用戶將一個(gè)事件和觸發(fā)事件的方式綁定到匹配對(duì)象上。
trigger(type)   用戶觸發(fā)type形式的事件。$("p").trigger("click")
還有：unbind()   unbind(type)    unbind(type, fn)

Dynamic event(Function)    綁定和取消綁定提供函數(shù)的簡(jiǎn)捷方式
例：

$("#a").bind("click",function() {
$(this).addClass("red");
})也可以這樣寫：

$("#a").click(function() {
$(this).addClass("red");
});

最終效果是當(dāng)鼠標(biāo)點(diǎn)擊id為a的層上時(shí)圖層增加一個(gè)red樣式，

jQuery提供的函數(shù)
用于browers事件
error(fn) load(fn) unload(fn) resize(fn) scroll(fn)

用于form事件
change(fn) select(fn) submit(fn)

用于keyboard事件
keydown(fn)    keypress(fn)    keyup(fn)

用于mouse事件
click(fn)    dblclick(fn)    mousedown(fn)   mousemove(fn)
mouseout(fn) mouseover(fn)     mouseup(fn)

用于UI事件
blur(fn) focus(fn)

以上事件的擴(kuò)展再擴(kuò)展為5類
舉例，click(fn)擴(kuò)展 click() unclick() oneclick(fn) unclick(fn)
click(fn)：增加一個(gè)點(diǎn)擊時(shí)觸發(fā)某函數(shù)的事件
click()：可以在其他事件中執(zhí)行匹配對(duì)象的click事件。
unclick ()：不執(zhí)行匹配對(duì)象的click事件。
oneclick(fn)：只增加可以執(zhí)行一次的click事件。
unclick (fn)：增加一個(gè)點(diǎn)擊時(shí)不觸發(fā)某函數(shù)的事件。
上面列舉的用于browers、form、keyboard、mouse、UI的事件都可以按以上方法擴(kuò)展。

七：Ajax支持
通用方式：
$.ajax(prop)    通過(guò)一個(gè)ajax請(qǐng)求，回去遠(yuǎn)程數(shù)據(jù)，prop是一個(gè)hash表，它可以傳遞的key/value有以下幾種。
         (String)type：數(shù)據(jù)傳遞方式(get或post)。
         ((String)url：數(shù)據(jù)請(qǐng)求頁(yè)面的url
         ((String)data：傳遞數(shù)據(jù)的參數(shù)字符串，只適合post方式
         ((String)dataType：期待數(shù)據(jù)返回的數(shù)據(jù)格式(例如"xml","html","script",或"json")
         ((Boolean)ifModified：當(dāng)最后一次請(qǐng)求的相應(yīng)有變化是才成功返回，默認(rèn)值是false
         ((Number)timeout:設(shè)置時(shí)間延遲請(qǐng)求的時(shí)間?？梢詤⒖?.ajaxTimeout
         ((Boolean)global：是否為當(dāng)前請(qǐng)求觸發(fā)ajax全局事件，默認(rèn)為true
         ((Function)error：當(dāng)請(qǐng)求失敗時(shí)觸發(fā)的函數(shù)。
         ((Function)success：當(dāng)請(qǐng)求成功時(shí)觸發(fā)函數(shù)
         ((Function)complete：當(dāng)請(qǐng)求完成后出發(fā)函數(shù)
jQuery代碼及說(shuō)明

$.ajax({url: "ajax.htm",
          success:function(msg){
                         $(div"#a").html(msg);
                }
    });

將ajax.htm返回的內(nèi)容作為id為a的div內(nèi)容

$.ajax({ url: "ajax.ASPx",
              type:"get",
             dataType:"html",
             data: "name=John&location=Boston",
             success:function(msg){
                                 $("#a").html(msg);
                              }
         });

用get方式向ajax.ASPx頁(yè)面?zhèn)鲄?shù)，并將返回內(nèi)容負(fù)給id為a的對(duì)象。

$.ajaxTimeout(time) 設(shè)置請(qǐng)求結(jié)束時(shí)間
$.ajaxTimeout( 5000 )

其它簡(jiǎn)化方式：

$.get(url, params, callback) 用get方式向遠(yuǎn)程頁(yè)面?zhèn)鬟f參數(shù)，請(qǐng)求完成后處理函數(shù)，除了url外，其它參數(shù)任意選擇！

$.get( "ajax.htm" , function(data){ $("#a").html(data) })

$.get(   "ajax.ASP",
            { name: "young", age: "25" },
            function(data){ alert("Data Loaded: " + data); }
        ) $.getIfModified(url, params, callback) 用get方式向遠(yuǎn)程頁(yè)面?zhèn)鬟f參數(shù)，從最后一次請(qǐng)求后如果數(shù)據(jù)有變化才作出響應(yīng)，執(zhí)行函數(shù)callback
$.getJSON(url, params, callback) 用get方式向遠(yuǎn)程json對(duì)象傳遞參數(shù)，請(qǐng)求完成后處理函數(shù)callback。
$.getScript(url, callback) 用get方式載入并運(yùn)行一個(gè)遠(yuǎn)程Javascript文件。請(qǐng)求完成后處理函數(shù)callback。
$.post(url, params, callback) 用post方式向遠(yuǎn)程頁(yè)面?zhèn)鬟f參數(shù)，請(qǐng)求完成后處理函數(shù)callback
load(url, params, callback) 載入一個(gè)遠(yuǎn)程文件并載入頁(yè)面DOM中，并執(zhí)行函數(shù)callback

$("#a").load("ajax.htm", function() { alert("load is done"); } );仰天一笑 徐羽向ajax.htm頁(yè)面發(fā)出請(qǐng)求，將返回結(jié)果裝入id為a的內(nèi)容中，然后再執(zhí)行函數(shù)callback。
loadIfModified(url, params, callback) 用get方式向遠(yuǎn)程頁(yè)面?zhèn)鬟f參數(shù)，從最后一次請(qǐng)求后如果數(shù)據(jù)有變化才作出響應(yīng)，將返回結(jié)果載入頁(yè)面DOM中，并執(zhí)行函數(shù)callback
ajaxStart(callback) 當(dāng)ajax請(qǐng)求發(fā)生錯(cuò)誤是時(shí)執(zhí)行函數(shù)callback
ajaxComplete(callback) 當(dāng)ajax請(qǐng)求完成時(shí)執(zhí)行函數(shù)callback
ajaxError(callback) 當(dāng)ajax請(qǐng)求發(fā)生錯(cuò)誤時(shí)執(zhí)行函數(shù)callback
ajaxStop(callback) 當(dāng)ajax請(qǐng)求停止時(shí)執(zhí)行函數(shù)callback
ajaxSuccess(callback) 當(dāng)ajax請(qǐng)求成功時(shí)執(zhí)行函數(shù)callback

八：jQuery插件
隨著jQuery的廣泛使用，已經(jīng)出現(xiàn)了大量jQuery插件，如thickbox，iFX，jQuery-googleMap等，簡(jiǎn)單的引用這些源文件就可以方便的使用這些插件。這里我簡(jiǎn)單的介紹一些網(wǎng)址供大家參考，這些網(wǎng)站頭提供了大量的demo，并且使用及其簡(jiǎn)單，及時(shí)E文不好，也能快速掌握！
    http://jquery.com/plugins     官方推薦
    http://interface.eyecon.ro/demos    效果超級(jí)棒，使用更簡(jiǎn)單，一定有你喜歡的！
    http://www.dyve.NET/jquery/
    http://bassistance.de/jquery-plugins

還有其它很多插件，大家可以google以下，如果大家發(fā)現(xiàn)好的了，可以留言共享以下！

——————————————————————————————————————————————

    至此jQuery已經(jīng)介紹完畢，并合并整理提供給大家下載，更多詳細(xì)的使用請(qǐng)大家參考官方網(wǎng)站，下面我再推薦一些jQuery的學(xué)習(xí)網(wǎng)站方便大家更好的掌握這項(xiàng)工具！
    http://keel.sike.googlepages.com/jQuery_getting_started.html     中文入門介紹，Keel翻譯
    http://jquery.com/api      jquery提供全部基本方法的介紹及demo，方便大家查詢！

it知識(shí)庫(kù)：（收藏）JQuery使用手冊(cè)，轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。

天天躁日日躁狠狠躁AV麻豆-天天躁人人躁人人躁狂躁-天天澡夜夜澡人人澡-天天影视香色欲综合网-国产成人女人在线视频观看-国产成人女人视频在线观看

（收藏）JQuery使用手冊(cè)

相關(guān)文章閱讀