一、动画效果

1、隐藏和显示

1)基本显示、隐藏效果

-show();显示

-hide();隐藏

作用:通过改变元素的宽度和高度来实现显示或隐藏

语法:jq对象.show(执行时间,动画完成后调用的函数)

动画执行时间,可以取值为:slow、normal、fast、毫秒数

2)滑动式动画效果

-slideDown();显示

-slideUp();隐藏

作用:通过改变元素的高度,来实现显示或隐藏的效果

语法:jq对象.slideDown(时间,函数);

3)淡入淡出式动画效果

-fadeIn();淡入

-fadeOut();淡出

作用:通过改变透明度opacity来实现显示或隐藏

语法:jq对象.fadeIn(时间,函数);

2、自定义动画

-animate();动画函数

语法:jq对象.animate({“css样式属性”:“属性值”},执行时间,函数);

那些样式可以使用动画

-取值为尺寸的属性

jQuery 对象数组 值列表_动画效果


jQuery 对象数组 值列表_ide_02


jQuery 对象数组 值列表_jQuery 对象数组 值列表_03


一、类数组的操作

1、什么是类数组

jQuery对象封装了一个或多个DOM对象,他拥有类似数组的特点,也有用类似数组的一些操作;

2、类数组操作
-length属性:表示封装了几个dom对象
-each(匿名函数);遍历类数组,匿名函数用于处理dom对象,函数中的this表示正在遍历的DOM对象,会随着遍历的进行发生改变,我们可以给函数添加一个形参,表示当前所遍历的dom对象的下标
语法:jq对象.each(function(){
    操作;
})

-jq对象.get();得到一个DOM对象组成的数组
-index(jq对象);获取jq对象在类数组中的下标
语法:jq对象.index(jq子对象);

二、使用插件

1、jQuery插件库

https://jqueryui.com/ 2、datepicker(日期选择工具)

1)默认功能

日期选择器一般会绑定在标准的input,type=text元素上,当文本框获取焦点时,会打开一个日历以供选择,点击上面的任何一个日期会关闭日历,且会将选择的日期显示在文本框中

2)基础使用

-首先导入需要的js、css文件

-绑定日历:jq对象.datepicker();

$("#ui-datepicker-div").css(“height”,“800px”);可以调整日历控件的尺寸

3)带动画的

如果需要设置动画,我们要将datepicker的动画属性进行单独设置,语法:

jq对象.dapicker({

showAnim:“动画名”

})

4)显示其他月份的日期

需要单独设置属性:

showOtherMonths:true

设置其他月份的日期可点

selectOtherMonths:true

jQuery 对象数组 值列表_ide_04