|
|
JQuery優(yōu)點(diǎn)
◦體積小（v1.2.3 15kb）
◦豐富的DOM選擇器(CSS1-3 + XPath) ◦跨瀏覽器（IE6,FF,Safari,Opera）
◦鏈?zhǔn)酱a
◦強(qiáng)大的事件、樣式支持
◦強(qiáng)大的AJAX功能
◦易于擴(kuò)展，插件豐富
jQuery的構(gòu)造函數(shù)接收四種類型的參數(shù)：
1. jQuery(expression,context)
2. jQuery(html)
3. jQuery(elements)
4. jQuery(fn)
第一種根據(jù)表達(dá)式（ID，DOM元素名，CSS表達(dá)式，XPath表達(dá)式）找出文檔中的元素，并組裝成一個(gè)jQuery對(duì)象返回。
DEMO:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery basic</title>
<style type="text/css">
.selected
{
background-color:Yellow;
}
</style>
<script src="../scripts/jquery-1.2.3.intellisense.js" type="text/Javascript"></script>
</head>
<body>
<h3>jQuery構(gòu)造函數(shù)</h3>
<ul>
<li>jQuery(expression,context)</li>
<li>jQuery(html)</li>
<li>jQuery(elements)</li>
<li>jQuery(fn)</li>
</ul>
<script type="text/Javascript">
</script>
</body>
</html>
將以下jQuery代碼加入文末的腳本塊中：
jQuery('ul>li:first').addClass("selected");
其中jQuery()可替換為快捷方式$()，如果$被其它對(duì)象占用，可使用jQuery.noConflict()函數(shù)取消快捷方式。
"ul>li:first"中ul>li表示所有位于ul下的li元素（為CSS表達(dá)式，XPath方式可用ul/li），:first表示其中的第一個(gè)。addClass()為jQuery對(duì)象用來添加CSS樣式類的函數(shù)，相反的函數(shù)為removeClass()。
再加入以下代碼：
$('ul').append($('<li>new item</li>'));
其中$('<li>new item</li>')將其中的字符串轉(zhuǎn)換為DOM對(duì)象，然后通過append()函數(shù)加入ul對(duì)象的最后。
接下來：
$(document).ready(function(){
$('ul').css('color','red');
});
jQuery構(gòu)造函數(shù)中還可以真接傳入DOM對(duì)象，如document，或jQuery對(duì)象（當(dāng)然就沒什么意義）。ready()函數(shù)為document添加事件處理函數(shù)，將ul的顏色設(shè)為紅色。
$(document).ready()由于應(yīng)用場景眾多，所以可以直接用$(fn)來代替，fn表示處理函數(shù)。（ready處理函數(shù)貌似在文檔內(nèi)容載入完成后執(zhí)行，無需等待相關(guān)其它圖片等資源載入完成，所以比load事件要更早執(zhí)行。
$(function(){
alert('welcome to jQuery');
});
以上代碼的效果是頁面一載入，就彈出一個(gè)對(duì)話框。
JavaScript技術(shù)：jQuery 入門講解1，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
