好了開始我的Jquery第一天。
我也是從Hello wrod!開始的。關於jquery 的引用我直接一筆帶過。如下：
. 代碼如下:
<html>
<head>
<title>jquery 鏈式操作</title>
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
alert("hello word!");
//靜止右鍵點擊
// $(document).bind("contextmenu",function(e){
// return false;
// });
});
</script>
</head>
<body>
</body>
</html>
接下來讓我們來看看一個復雜的實例，這個實例讓我們知道什麼是：jquery的鏈式操作，
我用 . 來連接jquery 的鏈式操作。
可能有的人剛開始學query ，看起來比較陌生，在後面的瘋狂Jquery 中我會一一解釋。慢慢的你就會明白。
. 代碼如下:
<html>
<head>
<title>Jquery 鏈式操作</title>
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<style type="text/css">
#menu {width:300px}
.has_children {
background:#555;color:#fff;cursor:pointer;
}
.highligt{color:#fff;background:green;}
div{padding:0;margin:0px;}
div a {
background:#888;display:none;float:left;width:300px;
}
</style>
<script type='text/javascript'>
$(document).ready(function(){
// alert("給所有目錄添加click 事件");
$(".has_children").click(function(){
$(this).addClass('highligt') //為當前元素添加highligt類。
.children("a").show().end() //將子節點的<a>元素顯示出來。並且重新定位到上次操作的元素
.siblings().removeClass("highligt") //獲取同級的元素。(或兄弟元素)，並且去掉他們highligt類
.children("a").hide(); //將同級的元素，兄弟元素下的<a> 元素隱藏
});
});
</script>
</head>
<body>
<div id='menu'>
<div class='has_children'>
<span>第一章 認識Jquery</span>
<a>1.1 Javascript 和 Javascript庫</a>
<a>1.2 加入Jquery</a>
<a>1.3 編寫簡單的Jquery 代碼</a>
<a>1.4 Jquery對象 和 Dom對象</a>
<a>1.5 解決Jquery 和其他庫的沖突</a>
<a>1.6 Jquery 開發工具和插件</a>
<a>1.7 小結</a>
</div>
<div class='has_children'>
<span>第二章 Jquery選擇器</span>
<a>2.1 Jquery 選擇器是什麼？</a>
<a>2.2 Jquery 選擇器的優勢？</a>
<a>2.3 Jquery 選擇器</a>
<a>2.4 應用Jquery改寫實例</a>
<a>2.5 選擇器中的一些注意事項</a>
<a>2.6 案例研究————類似淘寶品牌列表的效果</a>
<a>2.7 還有其他選擇器嗎？</a>
<a>2.8 小結</a>
</div>
<div class='has_children'>
<span>第三章 Jquery中的DOM操作</span>
<a>3.1 DOM的操作分類</a>
<a>3.2 Jquery 中的DOM操作</a>
<a>3.3 案例研究————某網站的超鏈接和圖片效果</a>
<a>3.4 小結</a>
</div>
</div>
</body>
</html>