jQuery操作css,class,属性,dom,dom动画
一、jQuery操作css样式
1、jq对象.css(样式名,样式值)
2、jq对象.css({样式名:样式值,样式名:样式值,....})
3、获取css样式
二、jQuery操作class属性
1、添加类:jq对象.addClass(类名):追加
2、移除类:jq对象.removeClass(类名):移除指定类
3、判断一个类是不是存在:jq对象.hasClass(类名):返回true和false
4、判断类是不是存在如果存在则删除,反正添加:jq对象.toggleClass(类名)
三、jQuery操作属性操作:attr
1、设置属性:
jq对象.attr(属性名,属性值);
jq对象.attr({属性名:属性值,属性名:属性值,....})
2、获取属性:jq对象.attr(属性名);
注意对于布尔类型的属性值,应使用jq对象.prop(),当没设置值时返回false,attr返回undefined
四、jQuery动画
1、三组基本动画
a、显示隐藏:show([时间],[回调函数]),hide([时间],[回调函数]),
b、划入画出:slideDoem([时间],[回调函数]),slideUp([时间],[回调函数]), 切换:slideToggle([时间],[回调函数]),
c、淡入淡出:fadeIn([时间],[回调函数]),fadeOut([时间],[回调函数]),fadeToggle([时间],[回调函数])
2、自定义动画:animate({})
第一个参数:对象,里面可以传需要动画的样式
第二个参数:动画的执行时间
第三个参数:动画的执行效果
a、默认'swing'越来越快
b、'linear'匀速前进
第四个参数:回调函数
注意:第一个参数必填,使用前将元素设置CSS定位
解决动画队列用jq对象.stop();用在animate()方法前。
停止动画:stop()只停止当前动画队列的当前执行的动画
第一个参数:clearQueue:是否清楚动画队列(true,false)
第二个参数:jumpToEnd:是否跳转到当前动画的最终效果(true,false)
五、jQuery节点操作
1、创建节点
jq对象.append('<div></div>')
2、添加节点
jq对象.append(变量or对象):添加到子元素的最后面
jq对象.prepend(变量or对象):添加到当前元素的前面
jq对象.appengTo(变量or对象):把当前元素添加到变量or对象的里面
jq对象.prependTo(变量or对象):把当前元素添加到变量or对象的前面
jq对象.after(变量or对象):把当前元素添加到变量or对象后,做兄弟元素
jq对象.before(变量or对象):把当前元素添加到变量or对象前,做兄弟元素
3、清空节点
jq对象.empty():清空当前对象里的所有子元素
jq对象.remove():删除当前元素
4、克隆节点
jq对象.clone():克隆元素 :有一个布尔类型的参数:当为false时不会赋值方法,当为true时则赋值方法
注意:jQuery隐式迭代:
设置操作的时候:会给jq内部所有对象都设置上相同的值
获取的时候:智慧返回第一个元素对应的值