jQuery 效果+属性操作

79 阅读2分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第1天
jQuery效果
四、动画队列及其停止排队方法

  1. 动画或效果队列
    动画或者效果一旦触发就会执行,如果多次触发,就造成多个动画或者效果排队执行。
    1. 停止排队
    stop()
    (1)stop() 方法用于停止动画或效果。
    (2) 注意: stop() 写到动画或者效果的前面, 相当于停止结束上一次的动画。

五、淡入淡出效果
1.淡入效果语法规范
fadeIn([speed,[easing],[fn]])
2.淡入效果参数
(1)参数都可以省略。
(2)speed:三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值(如:1000)。
(3)easing:(Optional) 用来指定切换效果,默认是“swing”,可用参数“linear”。
(4)fn: 回调函数,在动画完成时执行的函数,每个元素执行一次。

六、自定义动画 animate

  1. 语法
    animate(params,[speed],[easing],[fn])
    2. 参数
    (1)params: 想要更改的样式属性,以对象形式传递,必须写。 属性名可以不用带引号, 如果是复合属性则需要采
    取驼峰命名法 borderLeft。其余参数都可以省略。
    (2)speed:三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值(如:1000)。
    (3)easing:(Optional) 用来指定切换效果,默认是“swing”,可用参数“linear”。
    (4)fn: 回调函数,在动画完成时执行的函数,每个元素执行一次。

jQuery属性操作
一、设置或获取元素固有属性值 prop()
所谓元素固有属性就是元素本身自带的属性,比如 a 元素里面的 href ,比如 input 元素里面的 type。

  1. 获取属性语法
    prop(''属性'')
  2. 设置属性语法
    prop(''属性'', ''属性值'')
    二、设置或获取元素自定义属性值 attr()
    用户自己给元素添加的属性,我们称为自定义属性。 比如给 div 添加 index =“1”。
  3. 获取属性语法
    attr(''属性'') // 类似原生 getAttribute()
  4. 设置属性语法
    attr(''属性'', ''属性值'') // 类似原生 setAttribute()
    改方法也可以获取 H5 自定义属性
    三、数据缓存 data()
    data() 方法可以在指定的元素上存取数据,并不会修改 DOM 元素结构。一旦页面刷新,之前存放的数据都将被移除。
  5. 附加数据语法
    data(''name'',''value'') // 向被选元素附加数据
  6. 获取数据语法
    date(''name'') // 向被选元素获取数据
    同时,还可以读取 HTML5 自定义属性 data-index ,得到的是数字型