jQuery

利用jQuery进行遍历

js原生:
for(var i=0;i>?;i++){ }

jQuery:
方式一: 想要遍历的jQuery对象.each(function(index,dom){ });

方式二: $.each(想要遍历的jQuery对象,function(index,dom){ });

操作元素的值或者标签体
xxx():获取操作
xxx("值"):设置
获取或设置值: val();
获取或设置标签体: html()
获取或设置标签体: text()
html和text的区别在于前者会解析,后者不会

插入操作:
内部插入:
append() a.append(b) 将后者插入到前者的后面
prepend() a.prepend(b) 将后者者插入到前者的前面

appendTo() a.appendTo(b) 将前者插在后者的后面
prependTo() a.prependTo(b) 将前者插在后者的前面

外部插入:
after() a.after(c) 在a的后面添加c
before() a.before(c) 在a 的前面添加c

内部插入和外部插入的区别: 内部插入可以在元素的内部插入元素
外部插入在同级元素插入元素

清除操作:
empty();清除
remove();移除,自杀

select下拉选择框
属性:
multiple:值multiple规定可以多选
size:控制显示项目的数目

表单对象属性过滤选择器

:enabled 可用的
:disabled 不可用
:checked (针对的是radio checkbox)
:selected 下拉选择框

【validator插件】

这个插件是基于jQuery写的,所以在引入插件的时候也必须引入jQuery

使用:
1.首先引入jQuery库
2.引入validator的库
3.在页面加载成功之后指定你想要验证的表单
$(function(){
$("选择器").validate();
})
4.validator方法的使用
$("选择器").validate({
rules:{ } //规则
messages:{ } //提示

})

5.常见的规则
required: true|false (必须填写)
number: true|false (必须填写数值类型)
min: 5 (最小值:写的数字必须大于五)
max: 5 (最大值:写的数字不能大于五)
range:[min,max] (区间:写的数字只能在这个区间)
maxlength:
minlength:
rangelength:
equalTo:"选择器" (密码和确认密码,所以的元素必须和选择器中的一样)
digits:整数 (只能写整数)
email:email (邮箱验证)

6.规则的书写格式:
$("选择器").validate({
rules:{ //书写格式 }
messages:{ }

})
书写格式:方式一:
想要校验的字段的name属性名:"规则名"
方式二:
想要校验的字段的name属性名:{
"规则1":值,
"规则2":值
}
7.自定义错误提示信息
书写格式:
方式一:
想要校验的字段的name 属性名:"提示信息"
方式二:
想要校验的字段的name属性名:{
"规则1":"提示信息1",
"规则2":"提示信息2"
}

8.validate的自定义规则
$.validator.addMethod(name,fn,message);
name:规则名
fn:
function(value,element,params){
value:用户输入的值
element:元素本身
params:参数
}
//必须有返回值boolean
message:默认的提示信息

扩展内容

筛选:
children():获取子元素
parent():获取父元素
find():获取后代元素
next():大弟弟
nextall():所有弟弟
prev():小哥哥
prevall():所有的哥哥
siblings():所有的兄弟

is():判断是否是指定的元素

我的学习之路_第二十八章_JQuery 和validator插件的更多相关文章

  1. 我的学习之路_第二十五_javaScript

    Javascript 作用:可以对表单数据进行校验,可以对页面实现一些动态效果 定义: JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型. 它的解释器被称为 ...

  2. 我的学习之路_第二十九章_bootstrap

    bootstrap 内置了html,css,js插件为一体的前端框架 响应式布局: 设计一套页面就可以使用于很多现实设备 bootstrap: 1.入门(响应式布局的容器) 1.先进入jQuery的j ...

  3. 我的学习之路_第二十七章_jQuery

    jQueryjs类库 把常用对象或者方法封装起来,让我们写代码效率更高 1.jQuery 2.extjs [jQuery入门] jQuery的引入: 通过script标签的src属性引入 入门: 获取 ...

  4. 我的学习之路_第二十三章_HTML

    Html : 超级文本语言 ( Hyper text Markup Language ) HTML 文件扩展名是 * .html HTML 结构都是有标签组成 通常情况下标签有开始标签和结束标签组成 ...

  5. 我的学习之路_第二十章_JDBC

    JDBC 使用JDBC技术,通过mysql提供的驱动程序,操作数据库 ● 1. 注册驱动 告知jvm 使用的是什么驱动程序(mysql,oracle) 使用API中的类 DriverManager中的 ...

  6. 我的学习之路_第二十一章_JDBC连接池

    JDBC连接池和DButils [DBCP连接池工具类] 使用读取配置文件的方式 DBCP中有一个工厂类 BasicDataSourceFactory 工厂类中有一个静态方法 返回值为: DataSo ...

  7. Python之路【第二十篇】:待更新中.....

    Python之路[第二十篇]:待更新中.....

  8. FastAPI 学习之路(四十六)WebSockets(二)

    上一篇文章,我们分享了WebSockets一些入门的,我们这节课,在原来的基础上,对于讲解的进行一个演示.我们最后分享了依赖token等.首先我们对上次的代码进行调整. 我们之前分享FastAPI 学 ...

  9. FastAPI 学习之路(五十六)将token存放在redis

    在之前的文章中,FastAPI 学习之路(二十九)使用(哈希)密码和 JWT Bearer 令牌的 OAuth2,FastAPI 学习之路(二十八)使用密码和 Bearer 的简单 OAuth2,Fa ...

随机推荐

  1. 《安卓网络编程》之第一篇 java环境下模拟客户端、服务器端

    1.Socket简介 在网络上的两个程序通过一个双向的通信连接实现数据的交换,这个双向链路的一端称为一个Socket.Socket通常用来实现客户方和服务方的连接.Socket是TCP/IP协议的一个 ...

  2. PHP中array_merge函数与array+array的区别

    在PHP中可以使用array_merge函数和两个数组相加array+array的方式进行数组合并,但两者效果并不相同,下面为大家介绍两者具体的使用区别. 区别如下: 当下标为数值时,array_me ...

  3. Junit4测试Spring

    使用Junit4.4测试 在类上的配置Annotation  @RunWith(SpringJUnit4ClassRunner.class) 用于配置spring中测试的环境  @ContextCon ...

  4. stat命令

  5. msseces.exe频繁出错的原因和解决方法?

    关机时会报错,什么内存为只读.. 以下是官方给的解决方案,相信对大部分用户都起作用,在这分享给大家. 对于当前遇到的问题,有可能是由于程序冲突导致.因此建议进入干净启动状态再确认问题是否发生: 1.如 ...

  6. xcode8.3 shell 自动打包脚本 记录

    题记 xcode升级8.3后发现之前所用的xcode自动打包基本无法使用,因此在网上零碎找到些资料,将之前的脚本简化.此次脚本是基于xcode证书配置进行打包(之前是指定描述文件.相对繁琐).因此代码 ...

  7. Java常用集合体系以及相互区别

    Collection集合特点: 1.2.1一些 collection 允许有重复的元素,而另一些则不允许 1.2.2一些 collection 是有序的,而另一些则是无序的 [有序是指与添加的顺序一致 ...

  8. javaSE_07Java中类和对象-封装特性-思维导图

    思维导图看不清楚时: 1)可以将图片另存为图片,保存在本地来查看 : 2)右击在新标签中打开放大查看 (IE不支持,搜狗,360可以):

  9. 为什么使用dojo?dojo与jquery有什么不同?dojo适合什么开发场景?

    首先介绍一下dojo的特性: 1.Dojo是一个符合AMD规范的企业级框架(dojo是一个重量级框架) 2.Dojo全面支持异步加载JS机制(即:支持通过require异步加载JS模块,通过defin ...

  10. laytpl : 一款非常轻量的JavaScript模板引擎

    //假设你得到了这么一段数据 var data = { title: '前端圈', intro: '一群码js的骚年,幻想改变世界,却被世界改变.', list: [{name: '贤心', city ...