首页 > 代码库 > JQuery快速学习

JQuery快速学习

楼主在学习的过程中注意到JQuery的强大、灵活;给出一个简单的教程,让你在最短的时间学会常用JQuery的用法!

  • 简介
  • 语法
  • 选择器
  • 事件处理
  • Ajax
 jQuery 是一个 JavaScript 函数库。

 

jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。

 基础语法是:$(selector).action()

可以理解为3部分,1、$->告诉浏览器你用的是JQuery,2->选择你要操作的节点,3->对节点的操作!

选择器

元素选择器

选择所有的p:$("p")

选择id=‘Fox_zhuang’的所有元素:$("#Fox_zhuang")

属性选择器:选择href=http://www.mamicode.com/‘www.cnblogs.com/Fox_zhuang‘的标签:$("a[href=http://www.mamicode.com/‘www.cnblogs.com/Fox_zhuang‘]")

等~

这里给出几个常用的选择方式:

1、选择table除了表头的所有行:$("#tableid tr:gt(0)")

2、选择到当前节点的左右节点:

<table id="mytab"><tr><td><input type="text" value="123"/></td><td><input type="button" value="345"/></td></tr></table>
$("#mytab td").find("input[type=‘text‘]").parent().next().find("input[type=‘button‘]")

事件处理

几种常用的事件绑定方式:

.on() 在选择元素上绑定一个或多个事件的事件处理函数。V1.7+

.off() 在选择元素上移除一个或多个事件的事件处理函数。V1.7+

.bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数。V1.0

.one(type,[data],fn) 为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数。V1.1+

.unbind(type,[data|fn]]) bind()的反向操作,从每一个匹配的元素中删除绑定的事件。V1.0+

几个常用方法的方法:

$(document).ready(function(){}-----当DOM载入就绪可以查询及操纵时绑定一个要执行的函数,在onload()前触发;
$("input[type=‘text‘]").blur(function(){alert(‘123‘)});-----给所有的文本框绑定失去焦点事件
.change(),.click(),.dbclick(),.focus()等...

JQuery快速学习