一:何为jquery
jquery是一个快速,简洁的javascript框架,是一种简便的js设计模式,它可以优化HTML文档操作,事件处理,Ajaxj交互。web页面的处理离不开jq。
2006年诞生。1.3及更早版本,通过eval解析json对象;1.4后,使用JSON.parse解析,对json对象的书写验证更加严格。
兼容几乎所有浏览器。
语言特点:快速获取文档元素,漂亮的页面动态效果,ajax无刷新页面;增强的事件处理,更改网页内容。
参考网页:jquery在线手册:http://hemin.cn/jq/index.html。当前版本:1.12.1
二:核心
1:jquery(selector,[context]):接受字符串,匹配一组元素。默认在document查找,否则在context中查找。一切基于这个函数。一般写作:$()
$("div"):找到所有div元素
$(document.body):找到body
$("input",document.form[0]):找到第一个表单的所有input元素
2:jquery(callback):$(document).ready()的简写,更简写为$(function(){});在dom文档载入完成后执行的函数。
3:each(callback):对每一个匹配的元素执行一个函数
$("div).each(function (index,domele){
//domele == this当前元素,index当前元素的索引
})
4:size():和length相同,返回对象中元素的个数
$("img").size() // ==$("img").length
5:get():取得匹配元素的第I个元素
6:index():搜索匹配的元素,返回索引值
7:data(key,value):在元素上存放数据
三:选择器
1:$("#A"):查找id="A"的元素
2:$("div"):查找div标签元素
3:$(".B"):查找class="B"的元素
4:$("*"):查找所有元素,多结合上下文查找
5:$("p,div"):逗号=OR,
6:$("p div"):p为父元素下的后代div元素
7:$("p > div"):p为父元素下的子div元素
8:A+B == A元素的next为B的元素
~ == 所有同辈元素
9:$("li:first"):第一个li元素 // :last最后一个
:not(A) == 去除A后的所有元素
:even == 索引为偶数的元素
:odd == 奇数
:eq(index) == 特定索引值
:gt(index) == 大于索引值
:it(index) ==小于索引值
10::has(A) 匹配所有含有A的元素
:hidden匹配所有不可见元素//visible可见
11:[attr]:匹配包含给定属性的元素
[attr = v]:匹配属性是v的元素 // != 不是 ^=以v开头 $=结尾 *=包含
12::first-child:为每个父元素匹配第一个子元素
:first-of-type:相同元素名称的第一个兄弟元素
13::input::查找所有input元素// :text :button :disabled :checked多选框被选中的元素 :selected下拉框被选中的元素