jQuery学习02

1. jQuery操作样式
1.1 使用jQuery设置css样式
1.1.1 设置单个样式
jQueryobj.css(name,value);设置需要更改的属性名和属性值。
1.1.2 设置多个样式
jQueryobj.css(obj);obj:{name:value,name:value,...}由多个属性名和属性值组成的键值对组成的对象。
1.1.3 获取样式
jQueryobj.css(name);获取的是jQuery对象中第一个元素的对应属性的值。
1.2 使用jQuery设置class名
1.2.1 添加className
jQueryobj.addClass(className);在对象中追加指定的className，不影响原本存在的className。
1.2.2 移除className
jQueryobj.removeClass(className);在对象中找到并移除指定的className，如果未找到指定的className则无效果，如果未指定className则视为将该对象的所有className全部移除。
1.2.3 判断className是否存在
jQueryobj.hasClass(className);在对象的className中找是否存在指定的className，如果有返回true，如果没有则返回false。
1.2.4 切换className
jQueryobj.toggleClass(className);如果对象中存在指定的className，则将该className移除，如果对象中不存在指定的className，则给对象追加这个className。
2. jQuery动画
2.1 显示和隐藏动画
jQueryobj.show(speed,callback);让对象显示，如果不传入参数的话将直接显示对象，没有动画效果。
jQueryobj.hide(speed,callback);让对象隐藏，如果不传入参数的话将直接隐藏对象，没有动画效果。
jQueryobj.toggle(speed,callback);切换对象显示或隐藏状态，如果对象原来为显示状态则将对象隐藏，如果对象原来为隐藏状态则将对象显示，不传入传输也会有动画效果。
speed：动画执行的时间，callback：动画完成时执行的回调函数。
这组动画改变的是对象的宽度、高度和透明度。
2.2 淡入淡出动画
jQueryobj.fadeIn(speed,callback);让对象淡入，不传入参数也会有动画效果。
jQueryobj.fadeOut(speed,callback);让对象淡出，不传入参数也会有动画效果。
jQueryobj.fadeToggle(speed,callback);切换对象淡入或淡出状态，如果对象原来为完全透明则将
对象淡入，如果对象原来不为完全透明则将对象淡出。
jQueryobj.fadeTo(speed,to,callback);让对象淡入或淡出到指定的透明度，speed为必填参数，如果不填将会认为传入的to值为speed值。
to参数为需要淡入或淡出的目标透明度。
speed：动画执行的时间，callback：动画完成时执行的回调函数。
这组动画改变的是对象的透明度。
2.3 滑入和滑出动画
jQueryobj.slideDown(speed,callback);让对象滑入，不传入参数也会有动画效果。
jQueryobj.slideUp(speed,callback);让对象滑出，不传入参数也会有动画效果。
jQueryobj.slideToggle(speed,callback);切换对象滑入或滑出状态，如果对象原来高度为0时则将对象滑入，如果对象原来高度不为0则将对象滑出。
speed：动画执行的时间，callback：动画完成时执行的回调函数。
这组动画改变的是对象的高度。
2.4 自定义动画
jQueryobj.animate(prop, speed, easing, callback);自定义改变对象我们想要改变的属性及目标值。
prop:{name:value,name:value,...}由多个属性名和属性值组成的键值对组成的对象。
speed：动画执行的时间，callback：动画完成时执行的回调函数。
easing：动画执行时的显示效果。
2.5 参数详解
2.5.1 speed：可以传入两种值：
指定的字符串：fast、slow、normal。
数字：需要动画执行的时间，单位是ms。
2.5.2 callback：回调函数
在动画执行完再执行的函数，可以没有。
2.5.3 easing：动画显示效果
swing：动画的开始和结束时变化较慢，动画中间部分变化较快，成变化速度成正弦形式。
linear：匀速的线性变化，变化速度不变。
2.6 动画的队列
给一个对象注册多个动画，而注册的间隔时间很短时，所有被注册的动画需要依次等前面的动画执行完才会进行，这种现象就是动画队列。
jQueryobj.stop(clearQueue,jumpToEnd);停止当前正在执行的动画，它的两个参数分别表示：
clearQueue:是否清除动画队列中所有等待执行的动画。传入参数为boolean值。
jumpToEnd:是否跳转到当前动画的最终效果。传入参数为boolean值。
可以根据具体实现要求来设置stop的两个参数值。
3. jQuery操作DOM节点
3.1 创建DOM节点
$(htmlStr):htmlStr为html元素格式的字符串，$()的形式会将html字符串转换为jQuery对象。它的返回值就是这个对象。
3.2 添加DOM节点
3.2.1 append()
jQueryobj.append(jQueryobj);将这个参数对象追加到指定的父元素对象中，这个参数jQueryobj的内容可以是html元素格式的字符串，也可以是页面中获取的元素。
注意：如果参数为页面中获取的元素时，在追加的时候会将原页面元素剪切后粘贴到指定地方。
jQueryobj.append(htmlStr);会把htmlStr转换成jQuery对象后在进行添加。
jQuery会将这种字符串自动识别为DOM元素节点。
append()这种方法会将参数对象追加到指定对象的所有子元素的最后。
3.2.2 prepend(htmlStr/jQueryObj)
使用方法和注意点都和append完全一致，prepend()是将指定元素添加到当前对象的所有子元素的前面。
3.2.3 before(htmlStr/jQueryObj)
使用方法和注意点都和append完全一致，before()是将指定元素添加到当前元素的前面。
3.2.4 after(htmlStr/jQueryObj)
使用方法和注意点都和append完全一致，after()是将指定元素添加到当前元素的后面。
3.3 替换DOM节点
jQueryobj.html(htmlStr);将当前对象中的内容替换为指定的内容，会将htmlStr字符串自动识别为DOM元素节点。
3.4 清空DOM节点
3.4.1 jQueryobj.html("");将当前对象中的内容替换为空内容，不推荐使用这种方式的清空，因为这种只会情况内容，而内容对应的事件等都还保留在内存中。
3.4.2 jQueryobj.empty();清空当前对象的所有子元素，包括子元素对应的事件等。
3.5 删除DOM节点
jQueryobj.remove();删除当前对象，包括当前对象的所有子元素和注册的事件。
3.6 克隆DOM节点
jQueryobj.clone(flag);克隆当前对象，默认为深度克隆，且只能深度克隆。
参数flag为是否克隆当前对象注册的事件，传入值为boolean类型。