JS学习笔记

2.jQuery样式操作

2.1操作css的方法

jQuery可以使用css方法来修改简单元素样式：也可以操作类，修改多个样式

（1）参数只写属性名，则是返回属性值

$(this).css("color");

(2).参数市属性名，属性值，逗号分隔，是设置一组样式，属性必须加引号，值如果是数字就可以不用跟单位和引号

$(this).css("color","red");

（3）参数可以是对象形式，方便设置多组样式。属性名和属性值用冒号隔开，属性可以不用加引号

$(this).css({"color":"white","font-size":"20px"});

2.2设置类样式方法

作用等同于以前的classList，可以操作类样式，注意操作类里面的参数不要加点。

（1）添加类

$("div").addClass("current");

(2)移除类

$("div").removeClass("current");

（3）切换类

$("div").toggleClass("current");

2.3类操作与className区别

原生JS中className会覆盖元素原先里面的类名

jQuery里面类操作只是对指定类进行操作，不影响原先的类名。

3.jQuery效果

jQuery给我们封装了很多效果，最常见的如下：

 3.1显示隐藏效果

1.显示语法规范

show([speed,[easing],[fn]])

2.显示参数

（1）参数都可以省略，无动画直接显示。

（2）speed：三种预定速度之一的字符串（”show“，"normal",or"fast"）或表示动画时长的毫秒数值（如：1000）.

（3）easing：（Optional）用来指定切换效果，默认是"swing",可用参数"linear".

(4)fn:回调函数，在动画完成时执行的函数，每个元素执行一次。1.

5.jQuery属性操作

所谓元素固有属性就是元素本身自带的属性，比如<a>元素里面的href，比如<input>元素里面的type。

1.获取属性方法

prop（"属性"）

2.设置属性语法

prop（"属性"，"属性值"）

该方法也可以获取H5自定义属性

5.3数据缓存data（）

data()方法可以在指定的元素上存取数据，并不会修改DOM元素结构。一旦页面被刷新，之前存放的数据都将被清除。

6.jQuery内容文本值

主要针对元素的内容还有表单的值操作。

1.普通元素的内容html()（相当于原生innerHTML）

html()  //获取元素的内容

html("内容")//设置元素的内容

2.普通元素文本内容text()（相当于原生innerText）

jQuery元素操作

主要是遍历，创建，添加，删除元素操作。