一、 Jquery常用特效
1.直接显示、隐藏
2.淡入、淡出
3.滑动
代码
三套显示隐藏的区别:
二、 Jquery操作CSS
jquery中可以通过方法 css 修改元素的样式,
还可以通过addClass、removeClass对样式css进行操作
css 修改单个样式
元素.css(“样式名”,”样式值”);
css修改多个样式
元素.css({“样式名1”:”样式值1”,”样式名2”:”样式值2”});
addClass 添加一个、多个类
元素.addClass(“类名1 类名2 类名3”);
removeClass 移除类
元素.removeClass(“类名”);
动态切换类
元素.togglerClass(“类名”);
两套方法的使用区别:
1. css这种方法优先级是最高的
2. css这种写法适合少量样
3. addClass这种写法能够提高代码的可重用性,可维护性,并且不需要频繁切换复用性。优先级比css低
代码
效果
三、Jquery操作属性
全选、选不选
jquery操作属性的方法有两个 attr() prop()
获取参数
jquery对象.attr(属性名); jquery对象.prop(属性名);
修改参数
jquery对象.attr(属性名,属性值) jquery对象.prop(属性名,属性值)
具体两个方法使用区别
<a href=”” alt=”” action=”” >超链接</a>
href、alt 这两个属性都有一个特点,html能认识他们。 这种也叫固有属性。
action这个属性在a标签,html不认识,但是可以加。 这种叫做自定义属性. 或者叫特性
1.固有属性适合 prop获取
2.自定义属性、特性适合attr 获取
3.prop是jquery1.6之后提出新方法。
4.attr 在jquery1.5之后就不再维护了
5.优先使用prop
代码
四、 Jquery操作DOM
jquery操作Dom主要分为 三种操作 1.添加节点 2.修改节点
3.删除节点 4.获取
添加子节点
append() 追加到末尾
prepend 追加到开头
添加同辈节点
after() 之后添加
before() 之前添加
修改节点
需要先获取节点通过 html()即可修改元素
删除 remove
先获取节点调用remove()进行删除元素
代码
五、jquery插件-validation-表单验证
之前我们使用js实现表单验证,代码量比较大,如果单纯使用js验证,
遇到很多验证项就会相当麻烦.
因此使用validation验证框架方便完成表单验证操作.
步骤
1. 需要导入validation的插件相关资源
jquery.validate.js 、jquery-1.8.3.js 、messages_zh.js
2. 对需要验证的表单,添加验证方法 validate()
$(“#myForm”).validate()
3. 在需要验证的输入项目中 加入具体的验证规则
input type=”text” name=”username” required=”true” />
4. 自定义错误提示
- 导入相关资源
- 表单添加验证方法
- 添加规则
代码