jQuery中的css()方法 操作class 节点操作 事件进阶

jQuery中的css()方法

css()方法设置或返回被选元素的一个或多个样式属性。

addClass()

addClass ()方法向被选元素添加一个或多个类名。

该访法不会移除已存在的class属性，仅仅添加一个或多个类名到class 属性。

提示:如需添加多个类,请使用空格分隔类名。

html()、text() 与val()

html()

htm1 ()可以对HTML代码进行操作，类似于JS中的innerHTML。

当该方法用于返回内容时，则返回第一个匹配元素的内容。

当该方法用于设置内容时，则重写所有匹配元素的内容。

提示: 如只需设置或返回被选元素的文本内容,请使用text()方法。

text()

text()可以获取或设置元素的文本内容。

当该方法用于返回内容时，则返回所有匹配元素的文本内容(会删除HTML标记)。

当该方法用于设置内容时，则重写所有匹配元素的内容。

html()和text()的区别

htm1()和text()的区别如下:

语法	参数	功能
html()	无参数	用于获取第一个匹配元素的HTML内容或文本内容。
html(content)	content参数为元素的HTML内容	用于设置所有匹配元素的HTML内容或文本内容。
text()	无参数	用于获取所有匹配元素的文本内容。
text (content)	content参数为元素的文本内容	用于设置所有匹配元素的文本内容。

val()

va1()可以获取或设置元素的value属性值。

当用于返回值时:该访法返回第一个匹配元素的 value属性的值。

当用于设置值时:该方法设置所有匹配元素的value属性的值。

注意:val() 方法通常与HTML表单元素一起使用。

hasClass()

hasClass ()方法判断被选元素是否包含这个类名。

jQuery添加元素

append()

append()方法在被选元素的结尾插入指定内容。

提示:是在父元素内未尾插入子元素。如需在被选元素的开头插入内容，请使用prepend()方法。

appendTo()

appendTo()方法在被选元素的结尾插入HTML元素。

提示:把子元素插入父元素末尾。如需在被选元素的开头插入HTML元素，请使用prependTo)方法。

prepend()

prepend()方法在被选元素的开头插入指定内容。

after()

after()方法在被选元素后插入指定的内容。

提示:是在当前元素的后面添加指定内容。如需在被选元素前插入内容，请使用before()方法。

before()

before()方法在被选元素之前插入指定的内容。

提示:是在当前元素的前面添加指定内容。

如需在被选元素后插入内容，请使用after()方法。

jQuery删除元素

remove()

remove()方法移除被选元素,包括所有的文本和子节点。

该方法也会移除被选元素的数据和事件。提示:如只需从被选元素移除内容，请使用empty()方法。

empty()

empty()方法移除被选元素的所有子节点和内容。

jQuery替换节点

replaceWith()

replacewith()方法把被选元素替换为新的内容。

replaceAll()

replaceA110)方法把被选元素替换为新的HTML元素。

jQuery复制节点

clone()方法生成被选元素的副[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-kBdkSSut-1675171636608)(D:\知识点图片\1.31\屏幕截图 2023-01-31 155816.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-fETlDkW4-1675171636609)(D:\知识点图片\1.31\屏幕截图 2023-01-31 160828.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XRIqHjJ1-1675171636609)(D:\知识点图片\1.31\屏幕截图 2023-01-31 162220.png)]

![屏幕截图 2023-01-31 162232](D:\知识点图片\1.31\屏幕截图 2023-01-31 164450.png

事件绑定

除了使用事件名绑定事件外，还可以通过其他方式绑定事件:

●bind 事件绑定;

●delegate 事件绑定;

●on事件绑定。

事件解绑

unbind方式，与bind对应

undelegate方式，与delegate对应

动画

显示/隐藏

●show(): 显示隐藏的元素。

参数有: slow 表示慢慢的; fast 表示快的; normal 表示中间速度。

●hide(): 隐藏显示的元素，参数和show一样。

●toggle():在show() 和hide()方法之间进行切换。

淡入淡出

●toggle():在show() 和hide()方法之间进行切换。

第1 个参数是速度(fast、 normal、 slow 或者毫秒数) ;第2个参数是透明度，值是一个0-1的数字。

●fadeOut(): 把隐藏的元素慢慢地显示出来。

●fadeToggle(): 在fadeIn()和fadeout()之间进行切换。如果是显示就淡入，如果是隐藏就是淡出。

滑动

●slideUp(): 把元素使用往上收的方式隐藏起来。

参数是fast、normal、 slow 或者毫秒数。

●slideDown(): 把元素使用向下展开的方式显示出来。

●fadeToggle(): 在fadeIn()和fadeout()之间进行切换。如果是显示就淡入，如果是隐藏就是淡出。

滑动

●slideUp(): 把元素使用往上收的方式隐藏起来。

参数是fast、normal、 slow 或者毫秒数。

●slideDown(): 把元素使用向下展开的方式显示出来。

●slideToggle(): 在s1ideup() 和s1ideDown()之间切换。如果是显示的就卷上去隐藏，如果是隐藏的就向