jquery的基本操作

1、jq中的hover事件(移入/移除)
写法参照：

 $('#div1').hover(function(){移入事件},function(){移出事件})

2、jq中的阻止默认事件；

1.e.preventDefault();
2、return false; （使用的时候要放在最底部）  

** 3、jq中的阻止事件传递（防止冒泡或下沉）**

     e.stopPropagation();

** 4、jq中获取元素的宽高**

   $('#div1').width()
   $('#div1').height()

** 5、jq中移除事件，off(事件类型，执行该事件的回调函数)**

$(document).off('mouseover',moveFn);

** 6、jq中获取元素的下标（下标从0开始）**

1.获取当前元素在所有同级别元素的下标：$(this).index();
2.获取当前元素在同类型元素且同级别元素的下标.index($(this))
3.获取某一组元素中，其中一个元素的下标（下标从0开始）
.eq(index);

** 7、jq中的class类名**

$('input').eq(index).addClass('active');
$('input').eq(index).removeClass('active');

** 9、jq中的创建节点**

创建：$('<li></li>');
插入：
(插入末尾)$('li').append(a);      a.appendTo( $('li'));
(插入前端)$('li').prepend(a);      a.prependTo( $('li'));

** 9、jq中删除节点**

$('#div1').remove();

** 10、jq中复制节点**

$('#div1').clone();

** 11、jq中节点的关系**

1.children();--获取匹配元素的中所有的子元素
2.siblings();--获取同辈标签，可以筛选
3.next();--获取匹配元素紧邻的下一个兄弟元素
4.prev();--获取匹配元素的紧邻的前一个兄弟元素
5.parent();--获取当前匹配元素的父元素

** 12、jq中的动画**

1、
show()--> 出现(参数：slow/fast/400)-$('div').show('slow',function(){回调函数})
hide()-->隐藏
toggle()--> 开关
slideDown()-->向下滑动
slideUp()--> 向上滑动
slideToggle()--> 滑动开关
fadeIn()-->逐渐出现
fadeOut()--> 逐渐消失
fadeToggle()--> 出现消失开关
fadeTo()-->参数 1.时间 2.透明度 (0~1)--$('div').on('click',function(){$('#div1').fadeTo(100,1)});
2、
delay();延时  delay $('#div1').delay(2000)stop()  
stop();()停止动画或者清除上一次动画   $('#div1').stop();

** 9、jq中的easing.js动画**

1. 引入<script type="text/javascript" src="jquery.easing.1.3.js"></script>
用法：
$('#div1').animate({ 
1、动画持续时间
duration:100,
2、动画运动方式
 easing:"easeInBounce",
3、动画执行完毕后的回调函数
complete:function(){
alert("动画执行完毕");
}
})

** 学到知识点：**

1、设置有分割的线性渐变
background:-webkit-linear-gradient(top,#dfdfdf,#dfdfdf 20%,white 20%,white 40%,#dfdfdf 40%,#dfdfdf 60%,white 60%,white 80%,#dfdfdf 80%,#dfdfdf 100%);
2、设置垂直居中
top:50%;
left:50%;
transform:translate(-50%,-50%);