jquery常用api

入口函数

 $(function(){

   })//形成沙箱  不会变量污染

jquery转dom

$(‘li’).get(1)
$(‘li’)[1]

ID选择器	$(“#id”);	    获取指定ID的元素
类选择器	$(“.class”);	获取同一类class的元素
标签选择器	$(“div”);	获取同一类标签的所有元素
并集选择器	$(“div,p,li”);	使用逗号分隔，只要符合条件之一就可。
交集选择器	$(“div.redClass”);	获取class为redClass的div元素
子代选择器	$(“ul>li”);	使用>号，获取儿子层级的元素，注意，并不会获取孙子层级的元素
后代选择器	$(“ul li”);	使用空格，代表后代选择器，获取ul下的所有li元素，包括孙子等

:eq（index）	$(“li:eq(2)”).css(“color”, ”red”);	获取到的li元素中，选择索引号为2的元素，索引号index从0开始。
:odd	$(“li:odd”).css(“color”, ”red”);	获取到的li元素中，选择索引号为奇数的元素
:even	$(“li:even”).css(“color”, ”red”);	获取到的li元素中，选择索引号为偶数的元素
:first	$(“li:first”).css(“color”, ”red”);	获取到的li元素中的第一个
:last	$(“li:last”).css(“color”, ”red”);	获取到的li元素中的最后一个

children(selector)	$(“ul”).children(“li”)	获取当前元素的所有子元素中的li元素
find(selector)	$(“ul”).find(“li”);	获取当前元素中的后代元素中的li元素
siblings(selector)	$(“#first”).siblings(“li”);	查找兄弟节点，不包括自己本身。
parent()	$(“#first”).parent();	查找父亲
eq(index)	$(“li”).eq(2);	相当于$(“li:eq(2)”),index从0开始
next()	$(“li”).next()	找下一个兄弟
prev()	$(“li”).prev()	找上一次兄弟

index() 获取元素索引值

attr() 设置属性
情况一： attr(name,value) //设置单个属性 $('img').attr("title","这是图片")
情况二: attr({key:value,key2:value2}) // 设置多个属性 $('img').attr({ "title": "这是图片", 'alt': '哈哈' })
情况三: attr(name) // 获取属性的值 $('img').attr('title')

removeAttr() 移除单个或者多个属性
$('img').removeAttr('alt')  // 移除单个属性
$('img').removeAttr('alt title') // 移除多个属性中间用"空格隔开"

prop()
1.6版本以后凡是布尔类型属性如：checked disabled selected不在使用attr来操作，换成prop
attr() 处理非布尔类型的固有的或者 自定义属性
prop() 处理自带属性和布尔类型属性， 不能自定义属性

show(time,func) 展示动画
time：单位毫秒，可以直接数字，也可以固定字符串形式：fast:快=200ms normal：正常=400ms slow:慢=600ms
hide() 隐藏动画
toggle()动画切换


fadeIn()
fadeOut()
fadeToggle()  淡入淡出


slideDown()
slideUp()
slideToggle()拉/上卷动画(没有参数时默认是normal也就是400ms):本质就是改变元素的height属性

自定义动画 animate()
参数1：必填，给动画设置样式 是个对象
参数2：指定动画时间，默认是normal
参数3：指定动画效果 默认是swing ,常用的还有linear等等
参数4：回调函数，动画完成后执行

 $('div').eq(0).animate({ left: 1000 }, 5000, function () {
            console.log('动画执行结束了');
        });

stop()停止动画
参数一：是否清除被选元素所有加入队列的动画？true/false，默认false
参数二: 是否直接跳到最后的执行结果？true/false,默认false
如果参数stop(true,true) 第一参数是true动画队列会被清除，所以即使第二参数也是true,但因为动画队列被清除后没有了后续动画也就执行不到最终的效果

$('<button>看我是一个按钮</button>')//创建元素


 // parent.append(child)
    $('div').append( $('<p>这是新建的p标签</p>') );//给该元素添加一个p
    $('<span>这是个span </span>').appendTo($('div'));//该元素添加到div
    $('div').prepend($('<div>这是新建的最前边？标签</div>'));//添加到最前面
    $('<p>这是一个P</p>').prependTo( $('div') );

 $('div').before('<p>前面一个P</p>')  同级的添加
   $('div').after('<p>后面一个P</p>')同级的添加 放后面
    

remove()删除自身，内部子元素一并删除
empty()清空内部所有元素，不包括自身
clone()参数默认false，参数false：克隆标签元素等，参数true: 深度克隆 包括事件
val() 设置和获取表单元素的值，如text，textarea等等
html() 相当于 innerHtml
text() 相当于 innerText

 width()无参数：获取元素width，有Number类型参数：设置width
 innerWidth()获取元素panding和width
 outerWidth()无参数，参数默认是false时：获取元素pading和border和width
 参数是true时：获取元素pading和border和width和margin
 height()同上

scrollTop()和scrollLeft()
scrollTop() 获取被卷曲的高度, 可设置卷曲高度
scrollLeft() 获取被卷曲的宽度，可设置卷曲高度

position()和offset()
offset方法和position方法都是用来获取盒子的位置的 left和top
offset方法获取的是盒子在整个'文档'中的位置
position方法获取相对父级元素[自身有定位,否则相对文档左上角]的偏移位置 offsetLeft和offsetTop
都是返回一个对象

$(selector).on( "click", function() {});事件注册

// 表示给$(selector)绑定代理事件，当必须是它的内部元素span才能触发这个事件，支持动态绑定
$(selector).on( "click",“span”, function() {});