JQ中的节点与动画

一 节点创建

节点、标签、元素、标记、DOM标签….指的都是HTML标签。

01在JQ中可以通过 $() 直接创建新的标签

$( “<li></li>” );—>此处就相当于得到了一个新的 li 标签

02 append()：　利用这个方法可以向某一个元素的内部后方添加一个新标签

＄( ‘ul’ ).append( 新节点 )—》 将新节点添加在ul的内部

append方法是将新节点做为子元素添加，同时是添加在父元系的最后

二 节点的清空和删除

01 .remove() :直接将某个节点从页面中删除。

02 .empty()：将某个节点里的子元素删除，但是当前元素还在

03 .trim()　：去除字符串前后两边空格

三 document语法和回调函数

01 $(‘ ‘).click( function(){} ): 这种语法结构只能给已经存在的元素添加事件，如果想要给”未来元素”绑定事件就用用下面的语法

$( document ).on( ‘事件名称’,’触发元素’，function(){

    // 事件处理函数

} );

是将某一个元素身上的某一个事件委托到document身上进行触发

02 在 slideDown() slideUp() slideToggle() hide() show() toggle() 这几个函数的小括号中都可以设置第二个参数，这个参数都是一个回调函数( cb callback ),所谓回调函数就是不用管它什么时候执行，只需要定义即可，在前面操作完成之后会自动调用的函数。

03 .prepend( 新节点 ): 可以将节点插入到某一个元素中，且每次总是插在最上方

四 透明度动画

01 fadeOut() fadeIn() fadeToggle() : 这三个为一组，用来做元素的透明度动画，小括号中都可以设置一个时间参数，单位是毫秒。

02 fadeTo(时间,目标值)： 这个函数可以设置当前元素的透明度需要变化到某个值

五 JQ自定义动画语法

$( ‘div’ ).animate( CSS属性,时间，形式，回调 );

1 第一个参数的格式和CSS多属性操作完全一致，用来设置哪些属性需要做动画，同时设置值。

2 时间单位是毫秒表示当前动画运动的总时长

3 形式默认为 swing 表示慢快慢，还有一个 linear 表示匀速，如果设置需要加引号【 除此之后JQ官方还有一些运动形式插件包 】

4 回调同样是在前面运动结束之后自动调用的一个函数，在这个里面可以设置链式运动。但是这种看起来的链式动画JQ会认是同一个物体的同一次动画。

六 JQ动画的停止和延时

01 .stop() : 这个函数用来停止动画，它里面如果不设置参数默认值是 false 表示将正在进行的动画停止，后续动画继续。设置为 true 表示将当前元素身上所有的动画都停止。

02 .delay(): 这个函数用来做动画的延时，接收一个单位为毫秒的时间，表示动画过了多久之后才会执行。

七 三目运算符

语法：

条件语句 ? 条件成立时执行 ： 条件不成立时执行

例如：

If( a > b ){ alert( 1 ); }else{ alert(2); }–> a>b ? 1 : 2