jQuery教程

二、jquery后续

本文主要是介绍二、jquery后续,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

  五、jquery链式调用:

jquery对象的方法会在执行完成后返回这个jquery对象,所有的jquery对象的方法可以可以连起来写

$('#div1')// id为div1的元素
		  .children('ul')//该元素下面的ul子元素
		  .slideDown('fast')//高度从零变到实际高度来显示ul元素
		  .parent() //跳到ul的父元素,也就是id为div1的元素
		  .siblings() //跳到div1元素评级的所有兄弟元素
		  .siblings('ul')//这些兄弟元素中的ul子元素
		  .slideUp('fast');//高度实际高度变换到零来隐藏ul元素

六、jquery属性操作

1、html()取出或设置html内容

// 取出html内容

var $htm = $('#div1').html

//设置html内容

$('#div1').html('<span>添加文字</span>');

2、prop()取出或设置某个属性的值

// 取出图片的地址

var $src = $('#img1').prop('src');

//设置图片的地址和alt属性

$('#img1').prop({src:"test.jpg",alt:"Test Image"});

七、jquery事件

事件函数列表:

blur()元素失去焦点
focus()元素获得焦点
change()当表单元素的值发生改变时
click()点击鼠标
mouseover()鼠标进入(进入子元素也触发)
mouseout()鼠标离开(离开子元素也触发)
mouseenter()鼠标进入(进入子元素不触发)
mouseleave()鼠标离开(离开子元素不触发)
ready() DOM加载完成
submit()用户递交表单

八、表单验证

1、什么时正则表达式:

能让计算机读懂的字符串匹配规则。

2、正则表达式的写法:

var re = new RegExp('规则','可选参数');

var re = /规则/参数;

3、规则中的字符

1)普通字符匹配:

eg:/a/匹配字符 'a' ,/a/b 匹配字符 'a,b'

2) 转义字符匹配:

\d 匹配一个数字 即0-9

\D 匹配一个非数字 ,即除了0-9

\w 匹配 一个单词字符(字母,数字,下划线)

\W 匹配任何非单词字符,等价于[ ^A-Za-A0-9]

\s 匹配一个空白符

\S 匹配 一个非空白符

. 匹配一个任意字符

var sTr01 = '123456asdf';
var re01 = /\d+/;
//匹配纯数字字符串

var re02 = /^\d+$/ ;
alert(re01.test(sTr01)) ; 弹出 ture
alert(re02.test(sTr01)) ; 弹出 false

4、量词:对左边的匹配字符定义个数

? 出现零次或一次(最多出现一次)

+ 出现一次或多次(至少出现一次)

* 出现零次或多次 (任意次)

{n} 出现n次

{n,m} 出现n到m次

{n,} 至少弧线n次

5、任意一个或者范围

[abc123] :匹配'abc123'中的任意一个字符

[a-z0-9]:匹配a到z或者0到9中的任意一个字符

6、限制开头结尾

^ 以紧挨的元素开头

$ 以紧挨的元素结束

7、修饰参数

g:global ,执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)

i :ingore case ,忽略大小写,默认大小写敏感

8、常用方法

test :正则.test(字符串)匹配成功,就返回真,否则就返回假。

正则默认规则:

匹配成功就结束,不会继续匹配,区分大小写。

常用正则规则:

//用户名验证:(数字字母或下划线6到20位)

var reUser = /^\w{6,20}$/;

//邮箱验证:

var reMail = /^[a-z0-9][\w\.\-]*@[a-z0-9\-]+(\.[a-z]{2,5}){1,2}$/i;

//密码验证:

var rePass  = /^[\w!@#$%^&*]{6,20}$/;

//手机号码验证:

var rePhone = /^1[34578]\d{9}$/;

九、ajax

ajax一个前后台配合的技术,它可以让JavaScript发送http请求,与后台通信,获得数据和信息。ajax技术的原理是实例化xmlhttp对象,使用此对象与后台通信,jquery将它封装成了一个函数$.java(),我们可以直接用这个函数来执行ajax请求。

ajax 需要在服务器环境下运行。

$.ajax 使用方法:

常用参数:

1、url 请求地址   2、type 请求方式,默认是'post',

3、dataType设置返回的数据格式,常用的是’json‘格式,也可以设置为'text'

4、data设置发送给服务器的数据

5、success 设置请求成功后的回调函数

6、error  设置请求失败后的回调函数

7、async 设置是饭否异步,默认值是'true',表示异步

 

这篇关于二、jquery后续的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!