如何使用jquery给html元素增加样式

2024-11-13 07:12:17

1、新建一个html文件,命名为test.html,用于讲解如何使用jquery给html元素增加样式

如何使用jquery给html元素增加样式

2、在test.html文件内,使用script标签加载jquery.min.js文件,这是jquery库文件,只有加载该文件,才能使用addClass()方法。

如何使用jquery给html元素增加样式

3、在test.html文件内,使用p标签创建一行文字,同时使用css设置文字的大小为30px,颜色为红色。

如何使用jquery给html元素增加样式

4、在test.html文件内,定义一个新的样式,类名为addcss,用于后面点击时,增加此样式至p标签。

如何使用jquery给html元素增加样式

5、在test.html文件内,创建一个button按钮,并绑定click点击事件,当按钮被点击时,执行function函数。

如何使用jquery给html元素增加样式

6、在function函数内,使用addClass()方法给p标签增加addcss类名样式,代码如下:

如何使用jquery给html元素增加样式

7、在浏览器打开test.html文件,点击按钮,给文字增加样式,如下图所示:

如何使用jquery给html元素增加样式如何使用jquery给html元素增加样式
猜你喜欢