从零开始学 Web之jQuery(三)元素操作,链式编程,动画相关方法

大家好,这里是「从零开始学 Web 系列教程」,并在下列地址同步更新……

github:https://github.com/Daotin/Web

博客园:http://www.cnblogs.com/lvonve/

CSDN:https://blog.csdn.net/lvonve/

在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。现在就让我们一起进入 Web 前端学习的冒险之旅吧!

一、使用css操作元素样式

1、常规写法

2、链式写法

3、键值对写法

二、链式编程

1、什么是链式编程?

对象在调用方法后可以继续调用方法,直到天荒地老。

2、语法

3、条件

链式编程的前提:对象调用方法后的返回值还是当前对象,那么就可以继续调用方法,否则不可以继续调用方法。

4、经验

在 jQuery 中,一般情况下,对象调用方法,如果这个方法是设置某个属性的话(方法有参数是设置属性的值),那么返回值几乎都是当前对象,就可以继续链式编程。

示例:

三、使用类样式操作元素样式

1、添加类样式

语法:

如果需要应用多个类样式,可以使用链式编程或者在一个addClass中写两个类选择器,中间用空格隔开。

2、移除类样式

语法:

3、判断是否采用类样式

语法:

4、切换类样式

语法

判断是否应用类选择器,如果没应用就添加,应用了就移除。

注意:

1、addClass, removeClass, toggleClass 方法不管有没有参数,返回值都是调用其的对象,都可以链式编程。

2、使用 CSS 方式是不能添加和移除类样式的。

四、动画相关方法

1、第一组

示例:

2、第二组

示例:

3、第三组

示例:

4、综合方法

示例:

PS:貌似颜色不能动画。

欢迎关注

Web前端之巅

念念不忘,必有回响。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180707G08XF200?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码关注腾讯云开发者

领取腾讯云代金券