jQuery常用方法

	jQuery对象转换为DOM对象:jQuery对象[下标];
	DOM对象转换为jQuery对象:$(DOM对象);

选择器

$('css选择器').css('属性','属性值');
$('标签名 :eq(index)').css('属性','属性值');选择容器中下标为number的元素;
$('标签名 子代标签:odd|even').css('属性','属性值');选择容器中下标为奇数(偶数)的元素;
$('标签名 子代标签:gt(index)|lt(index)').css('属性','属性值');选择容器中下标大于(小于)index的元素;

 

text方法

	作用:获取或者设置jQuery对象中的内容
	格式:jQuery对象.text()或jQuery对象.text(内容);

html方法

	作用:获取或者设置jQuery对象中的内容
	格式:jQuery对象.html()或jQuery对象.html(内容);

区别

1.text返回jQuery对象下所有文本内容拼接的字符串
2.html返回jQuery对象下的文本内容和后代节点
3.设置时,text不解析标签,html解析标签
4.如果jQuery对象有多个元素构成,text在执行时会有隐式迭代,html支取jQuery对象中的第一个元素

 

val方法

作用:获取或者设置表单元素中的值
格式:表单元素.val()或表单元素.val(值);

 

作用:为jQuery对象添加或设置属性

格式:jQuery对象.attr('属性名','属性值')

jQuery对象.prop('属性名','属性值')

注意:只有属性名时表示获取当前属性,属性名和属性值同时存在表示设置当前属性,prop不支持私有属性的操作.

 

作用:删除jQuery对象中的属性
格式:jQuery对象.removeAttr('属性名');
        jQuery对象.removeProp('属性名');
区别:removeProp的删除是将指定属性的值设为undefined,不能操作自定义属性,并且一次只能删除一个,否则删除失败,removeAttr如果要删除多个属性,属性名之间用空格隔开.

 

作用:获取或设置当前jQuery对象的css样式
格式:jQuery对象.css('属性名','属性值');
注意:当需要同时设置多个属性时,把属性和属性值以键值对的形式存放在对象中.
格式:jQuery对象.css({属性:'属性值',属性:'属性值'...})

 

addClass:添加类名
格式:jQuery对象.addClass('类名1 类名2...')

removeClass:删除类名
格式:jQuery对象.removeClass('类名1 类名2...')

toggleClass:删除或添加类名
格式:jQuery对象.toggleClass('类名1')
注:当该对象存在该类名时,操作内容为删除,否则为添加

获取尺寸

jQuery对象.width()
jQuery对象.height()
获取当前对象的宽高,不受其他因素影响

jQuery对象.innerwidth()
jQuery对象.innerheight()
获取当前对象的宽高,受内边距的影响

jQuery对象.outerwidth()
jQuery对象.outerheight()
获取当前对象的宽高,受内边距和边框的影响

 

scroll滚轮事件

 $(window).scroll(function() {
            console.log($(window).scrollTop());//jQuery中已经解决IE低版本的不兼容问题
        });

内部追加jQuery对象

append方法和appendTo方法
        1.作用：将jQuery对象以尾部追加的方式添加到容器内部
        2.格式：
            1)容器.append(被添加的jQuery对象或标签形成的字符串);
            2)被添加对象.appendTo(代表容器的jQuery对象或选择器);
            
 prepend方法和prependTo方法
        1.作用：将jQuery对象添加到容器的前端
        2.格式：
            1)容器.prepend(被添加的jQuery对象或标签形成的字符串);
            2)被添加对象.prependTo(代表容器的jQuery对象或选择器);         

外部追加

after方法、insertAfter方法
        1.作用：在目标元素的后面插入新的jQuery对象
        2.格式：
            1)目标元素.after(要插入的新的jQuery对象)
            2)要插入的新的jQuery.insertAfter(目标元素)
            
before方法、insertBefore方法
        1.作用：在目标元素的前面插入新的jQuery对象
        2.格式：
            1)目标元素.before(要插入的新的jQuery对象)
            2)要插入的新的jQuery.insertbefore(目标元素)
如果要操作的节点是页面中已有的，那么append、appendTo、prepend、prependTo、after、before、insertAfter、insertBefore方法具有移动节点的功能

删除元素

empty方法
    1.作用：清空某个容器下面的所有的内容
    2.格式：容器.empty();
    
remove方法
        1.作用：删除页面中的某个jQuery对象
        2.格式：要被删除的jQuery对象.remove('选择器');
        3.注意：如果被删除的元素身上有事件，那么事件会被删除

clone方法

1.作用：克隆页面中的元素
2.格式：要被克隆的元素.clone(true/false);false为默认值，表示不克隆元素的事件
3.返回值：被克隆出来的节点

$('div')
            .click(function() {
                console.log('helloworld');
            })
            .clone(true)
            .appendTo('body')
            .html('我是被克隆出来的div');

 

 

 

        hide：隐藏动画，格式：jquery对象.hide(动画执行所需时间【毫秒值】, function() {})
        show：显示动画，格式：jquery对象.show(动画执行所需时间【毫秒值】, function() {})
        toggle：显示/隐藏动画，格式：jquery对象.hide(动画执行所需时间【毫秒值】, function() {})
        
        向上滑动display:none,向下滑动display:block
        jquery对象.slideDown(动画执行所需时间【毫秒值】, function() {})
        jquery对象.slideUp(动画执行所需时间【毫秒值】, function() {})
        jquery对象.slideToggle(动画执行所需时间【毫秒值】, function() {})
        
        jquery对象.fadeIn(动画执行所需时间【毫秒值】, function() {})
        jquery对象.fadeOut(动画执行所需时间【毫秒值】, function() {})//display:none
        jquery对象.fadeTo方法：该方法的作用是，将元素的透明度逐渐改变到指定的值，注意，即使透明度为0，那么元素也是占位的，因为元素并没有被设置display：none

 

    1.作用：可以利用each方法对jQuery对象集合中的每个元素做单独的处理
    2.格式：jQuery.each(function(index, ele) {
        在函数内部可以对jQuery对象集合中的每个对象做单独的处理
    })
    3.说明：index表示jQuery对象集合中DOM对象的下标，ele表示该集合中的DOM对象

 

 

        1.该方法是$的一个静态方法，可以用该方法去处理数组或对象
        2.$.each(数组/对象，function() {})