黑马程序员php培训：javascript+jquery九天课程第九天(8)

第一篇：黑马程序员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.xiexiebang.com

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（）{

} } 案例：

九九乘法表

代码：

效果：

星星金字塔