第一篇：黑馬程序員php培訓：javascript+jquery九天課程第九天(8)

動畫：

基本：

Show(shijian，fn)（顯示）【在效果完成之后，會執行fn】 Hide(shijian，fn)（隱藏）【在效果完成之后，會執行fn】 Toggle()：切換【show和hide之間】

滑動：

slideDown:下滑,顯示 slideUp:收起，隱藏 slideToggle：切換效果

淡入淡出：

FadeIn：淡入 fadeOut：淡出

fadeToggle：切換效果 fadeTo(3000,(0-1),fn)

動畫案例：

點擊收藏夾，這臺電腦【后面的內容去隱藏或者顯示】

插件：成品插件

第二篇：黑馬程序員php培訓：javascript+jquery九天課程第九天

對象訪問：

Length:個數 Size()：個數

Each:遍歷

Each：每個元素

用法：元素.each(function(index,element){})Index：索引下標：從0開始 Element：元素

DOM：文檔處理

內部插入：父子級關系

$(a).Append（$(b)）把b插入到a中【a里面的后面】

$(b).appendTo($(a))把b插入到a中【a里面的后面】

$(a).prepend($(b));把b插入到a中【a里面的前面】

$(b).prependTo($(a));把b插入到a中【a里面的前面】 這種方式插入之后一定是父子級的關系

外部插入：兄弟級關系

$(a).after($(b))；把b插入到a的后面

$(b).insertAfter($(a));把b插入到a的后面 $(a).before($b);吧b插入到a的前面

$(b).insertBefore($(a))把b插入到a的前面

包裹：

Wrap：包裹$(a).wrap($(b))把a用b包裹起來【每個元素都會包裹】 Unwrap：取消包裹

wraoAll:把所有的都包裹起來【所有元素都會被一個包裹】 wrapInner:內部包裹

替換：

$(a).ReplaceWith($(b)):把a用b替換 $(b).replaceAll($(a));用b替換a

刪除：

Empty：刪除:刪除的是內容

Remove：刪除:刪除的是整個標簽

復制：

Clone：復制出一個一模一樣的元素

第三篇：黑馬程序員php培訓：javascript+jquery九天課程第九天

Jquery:一個JavaScript庫

目前：jquery是用的最火的一個javascript框架 Prototype：最早一個成熟的JS框架

Jquery,YUI(雅虎),tangram(百度),JX騰訊,kissy阿里 Jqurty:用戶多，速度快，文件小，比較復雜的DOM封裝

Javascript和jquery：

Js：ECMAscript，BOM，DOM Jq：把BOM和DOM的部分給封裝 JQ特點：

資源多,DOM封裝，瀏覽器的兼容

理念：write less，do more 部署： 注意：不管任何時候要寫JQ就必須引入,必須最先引入 下載:www.tmdps.cn

Compressed:壓縮版本，生產環境

Uncompressed：未壓縮版本,開發環境

Jquery-XXXXXX.js：有注釋，容易查看代碼 Jquery-XXXXXX.min.js；沒有注釋 開發中：1.x和2.x版本的區別

1.9以下的版本，1.9以上的都不值IE8 例子：

Jquery:核心，內容

語法：$(select).action();Console.log：控制臺日志

選擇器，事件，DOM，動畫，基本操作，插件，ajax 選擇器：

選擇器：選擇頁面元素的工具 最早的時候選擇器出名

基本選擇器:重點

#id：id選擇器

Element：元素選擇器 Class：類選擇器

層級選擇器：重點

ancestor descendant：表示選取ancestor里面所有的descendant元素 parent>child:選擇parent元素的子元素 selecter+：獲取后面的兄弟元素，下一個 selecter~：后去后面的兄弟元素，下所有個

內容選擇器：

:Contains(“text”)：匹配含有text內容的元素 :empty：匹配內容為空的元素

：has(selecter)：選擇包含有selecter的選擇器 :parent:選擇作為父元素的元素

注冊驗證：

1，鼠標放到email框會提示信息

2，鼠標離開就會檢測用戶所填寫的信息

3，提示信息是灰色字體，檢測之后（錯誤）的字體紅色 4，當填寫信息正確的時候會出現一個對號(圖片)5，提交的時候也會做檢測 6，檢測全部正確的話就讓提交

7，8，對象.HTML屬性對象.CSS屬性 9，Class和float a)Class：className b)Float：cssFloat

第四篇：黑馬程序員php培訓：javascript+jquery九天課程第八天

練習：

查看用戶所用的瀏覽器是上面 代碼：

效果：

DOM：描述網頁各個組成部分之間的關系

Var obj = document.getElementById(“id名”);火狐瀏覽器中空白處也算一個節點

ParentNode：父節點 childeNodes：子節點

firstChild：第一個子節點 lastChild：最后一個子節點

nextSibling：下一個姐妹或（兄弟）節點【注意，必須是同父級關系】 previousSibling：前一個兄弟節點【注意；必須是同父級關系】

案例：

星星案例：

網頁打開之后隨即大小，隨即位置出現星星

點擊星星讓星星消失

綁定一個onclick事件：

對象.事件=事件處理函數;注意：要想刪除某個節點，必須找到它的父節點 注意：在綁定事件中this可以直接使用 removeChild(obj)：刪除obj

游戲功能添加

游戲進度條

第五篇：黑馬程序員php培訓：javascript+jquery九天課程第二天

循環案例：

循環輸出1到100之間所有的數字

循環輸出1到100之間所有的偶數

求1到100之間所有數字的和（求和思想）

求和思想：

1，找一個變量用來記錄總和

2，把前一次的和加上新的值再賦值給變量

求1到100之間偶數的個數（計數思想）

dowhile循環

語法：

Var i=1;do{

//循環體

循環變量的改變

i++;}while(i<=100)執行：循環變量的初始化=》立刻執行一次循環體=》循環變量的改變=》循環條件的判斷（true）=》循環體=》循環變量的改變=-》循環條件判斷（false）=》跳出循環

注意：必定會執行

for循環

語法：

for(【循環變量的初始化】；【循環條件的判斷】；【循環變量的改變】){

【循環體】

} 執行：

【循環變量的初始化】=》【循環條件的判斷】（true）=》【循環體】=》【循環變量的改變】=》循環條件的判斷】（true）=》【循環體】=》【循環變量的改變】=》【循環條件的判斷】（tfalse）=》=》跳出循環

for循環的案例：

For循環的擴展

For循環的嵌套

For（）{

For（）{

} } 案例：

九九乘法表

代碼：

效果：

星星金字塔