鋒利Jquery 第一天

時間 2019-11-11

原文原文鏈接

以前一直學習，如今終於有時間來整理一下文檔了。javascript

如下文章都是本身學習Jquery 的筆記，css

但願能留下痕跡，也但願能幫助到您。html

好了開始個人Jquery第一天。java

我也是從Hello wrod!開始的。關於jquery 的引用我直接一筆帶過。以下：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>ide

<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>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。