五月综合缴情婷婷六月,色94色欧美sute亚洲线路二,日韩制服国产精品一区,色噜噜一区二区三区,香港三级午夜理伦三级三

您現(xiàn)在的位置: 365建站網(wǎng) > 365文章 > $(document).ready(function())(

$(document).ready(function())(

文章來(lái)源:365jz.com     點(diǎn)擊數(shù):261    更新時(shí)間:2012-05-11 14:54   參與評(píng)論
頁(yè)面加載完成后開(kāi)始運(yùn)行do stuff when DOM is ready 中的語(yǔ)句!
   $(document).ready(function() {
// do stuff when DOM is ready
});

   選擇器
   $(“a”)是一個(gè)jquery的選擇器(selector)
   $("")其中的字段就是元素的標(biāo)記。比如$("div")就是<div></div>
   click是函數(shù)對(duì)象的一個(gè)方法。方法為點(diǎn)擊鼠標(biāo)事件!
例:
$(document).ready(function() {
$("a").click(function() {
alert("Hello world!");
});
});

   $("div").click $("div")就是頁(yè)面中所有的 div標(biāo)簽 這句話(huà)就是給所有的標(biāo)簽為div的元素綁定了一個(gè)click事件 即當(dāng)所有div 被鼠標(biāo)單     擊的時(shí)候 執(zhí)行 alert("Hello World!");


   選擇器(selector)和事件(events)
   選擇DOM元素
   選擇一個(gè)ID為orderedlist的元素,相當(dāng)于javascript中的document.getElementByIdx("orderedlist"),jquery中只需要$("#id")其中的id為元素的ID,元素為任意元素!addClass為把這個(gè)元素的css的class改為red
   $(document).ready(function() {
    $("#orderedlist").addClass("red");
   });

$("#id > xx") 這種表示ID的元素下的所有元素標(biāo)記為xx的元素設(shè)置CSS的Class, id為元素的id xx為元素的標(biāo)記例<div><li><a>等!
$(document).ready(function() {
$("#orderedlist > li").addClass("blue");
});

$(document).ready(function() {
// use this to reset a single form
$("#reset").click(function() {
$("#form")[0].reset();
});
});




這個(gè)代碼只是ID為form的表單執(zhí)行reset()方法。但是萬(wàn)一你有很多個(gè)表單需要執(zhí)行呢?那么你可以這樣寫(xiě):
$(document).ready(function() {
// use this to reset several forms at once
$("#reset").click(function() {
$("form").each(function() {
this.reset();
});
});
});

另外一個(gè)你必須面對(duì)的問(wèn)題是選擇某個(gè)或某幾個(gè)元素。Jquery提供了filter()和not()方法。當(dāng)filter()是過(guò)濾一些適合filter()表達(dá)式元素,而not()是刪除和not()表達(dá)式相反的元素。當(dāng)你想選擇所有的li元素,并且不包含ul子元素呢?你可以這樣寫(xiě):
$(document).ready(function() {
$("li").not("[ul]").css("border", "1px solid black");
});

find(expr) 在匹配的對(duì)象中繼續(xù)查找符合表達(dá)式的對(duì)象
<p>Hello</p><p id="a">Hello Again</p><p class="selected">And Again</p>

Query代碼及功能:
function jq(){
alert($("p").find("#a").html())
}
在$("p")對(duì)象中查找id為a的對(duì)象

存疑:

結(jié)果是除了包含ul子元素的li,其他所有的li都得到了一個(gè)border.可能你也想選擇有name屬性的anchor(<a>):
$(document).ready(function() {
$("a[@name]").background("#eee");
});




要匹配屬性的值(value),我們可以用”*=”來(lái)代替”=”
$(document).ready(function() {
$("a[@href*=/content/gallery]").click(function() {
// do something with all links that point somewhere to /content/gallery
});
});




直到現(xiàn)在,我們已經(jīng)學(xué)到了很多選擇器的使用。這里還有種情況你需要選擇前一個(gè)或后一個(gè)元素。想一想starterkit.htm里的FAQ,當(dāng)你click問(wèn)題的時(shí)候,它是怎么實(shí)現(xiàn)隱藏和顯示的呢?代碼是這樣的:
$(document).ready(function() {
$('#faq').find('dd').hide().end().find('dt').click(function() {
var answer = $(this).next();
if (answer.is(':visible')) {
answer.slideUp();
} else {
answer.slideDown();
}
});
});




因?yàn)樯厦嬷挥形ㄒ灰粋€(gè)選擇器(#faq),我們用chain來(lái)減少代碼的長(zhǎng)度和提高代碼的易讀性和表現(xiàn)性.這里要說(shuō)明一下,如果按原文翻譯過(guò)來(lái)我想很多人都看不懂,感覺(jué)他自己也沒(méi)怎么說(shuō)明白。我說(shuō)說(shuō)我自己的理解:
‘dd’和‘dt’都是#faq的子元素,find()的作用就是找到它的子元素。End()應(yīng)該和next()搭配的,end()實(shí)質(zhì)上是把 ‘dd’過(guò)濾了,也就是next()的時(shí)候?qū)嵸|(zhì)上是參考的’dt’。這樣每個(gè)’dt’的next就是‘dd’,挺容易實(shí)現(xiàn)的。要是還不明白你可以邊參考邊照著做一遍。

除了同屬元素外,我們也可以選擇父元素:
$(document).ready(function() {
$("a").hover(function() {
$(this).parents("p").addClass("highlight");
}, function() {
$(this).parents("p").removeClass("highlight");
});
});



很容易看懂,p就是a的父元素。

(document)意思是說(shuō),獲取整個(gè)網(wǎng)頁(yè)文檔對(duì)象(類(lèi)似的于window.document),$(document).ready意思就是說(shuō),獲取文檔對(duì)象就緒的時(shí)候。

$(document).ready(function() {
// do stuff when DOM is ready//當(dāng)文檔載入后從此處開(kāi)始執(zhí)行代碼
});

 

如對(duì)本文有疑問(wèn),請(qǐng)?zhí)峤坏浇涣髡搲?,廣大熱心網(wǎng)友會(huì)為你解答!! 點(diǎn)擊進(jìn)入論壇

發(fā)表評(píng)論 (261人查看,0條評(píng)論)
請(qǐng)自覺(jué)遵守互聯(lián)網(wǎng)相關(guān)的政策法規(guī),嚴(yán)禁發(fā)布色情、暴力、反動(dòng)的言論。
昵稱(chēng):
最新評(píng)論
------分隔線(xiàn)----------------------------

其它欄目

· 建站教程
· 365學(xué)習(xí)

業(yè)務(wù)咨詢(xún)

· 技術(shù)支持
· 服務(wù)時(shí)間:9:00-18:00
365建站網(wǎng)二維碼

Powered by 365建站網(wǎng) RSS地圖 HTML地圖

copyright © 2013-2024 版權(quán)所有 鄂ICP備17013400號(hào)