jQuery
1.jQuery概述
什么是jQuery
jQuery是一个写的更少,但做得更多的js函数库
jQuery优势
可以简化js代码
可以像css那样获取元素
可以兼容常用的浏览器
jQuery版本
1.x 支持IE6+
2.X 支持IE9+
3.X 支持IE9+
不同版本会进行一些修改,例如删除某些方法或者新增一些方法
jQuery引入
jQuery就是一个js文件,所以引入jQuery和引入一个js文件一样
2.jQuery语法
(1)$介绍
$等价于jQuery,相当于调用了jQuery
(2)文档就绪事件
$(document).ready(function){
//xxx
}
可以简写为:
$(function){
//xxx
}
(3)DOM对象和jQuery对象的转换
DOM对象只能调用js提供的属性和方法,jQuery对象只能使用jQuery的方法,需要时,jQuery对象和DOM对象可以互相转换
DOM对象转jQuery
只需将DOM对象用
(
)
抱
起
来
即
可
j
Q
u
e
r
y
转
换
D
O
M
对
象
j
Q
u
e
r
y
对
象
.
g
e
t
(
0
)
3.
选
择
器
选
择
器
参
照
A
P
I
文
档
基
本
选
择
器
i
d
选
择
器
()抱起来即可 jQuery转换DOM对象 jQuery对象.get(0) 3.选择器 选择器参照API文档 基本选择器 id选择器
()抱起来即可jQuery转换DOM对象jQuery对象.get(0)3.选择器选择器参照API文档基本选择器id选择器(“#id值”)
元素名选择器:
(
“
元
素
名
”
)
类
选
择
器
:
(“元素名”) 类选择器:
(“元素名”)类选择器:(“.类名“)
通配符:
(
“
∗
”
)
分
组
选
择
器
:
(“*”) 分组选择器:
(“∗”)分组选择器:(“选择器1,选择器2,…”)
层级选择器
后代选择器:
(
”
父
选
择
器
后
代
选
择
器
”
)
子
元
素
选
择
器
:
(”父选择器 后代选择器”) 子元素选择器:
(”父选择器后代选择器”)子元素选择器:(“父选择器>子选择器”)
相邻兄弟选择器:
(
“
大
哥
+
小
弟
”
)
后
面
所
有
兄
弟
选
择
器
:
(“大哥+小弟”) 后面所有兄弟选择器:
(“大哥+小弟”)后面所有兄弟选择器:(“大哥~所有小弟”)
4.方法
parent():父元素
parents([“div”]):所有父元素
find(“div”):查找指定的子元素
next():后面紧邻的兄弟元素
nextAll([“div”]):后面所有的兄弟元素
perv():前面紧邻的兄弟元素
prevAll([“div”]):前面所有的兄弟元素
Siblings([“div”]):前后所有的兄弟元素
5.其他操作
$(“
append(“
remove():删除选中的元素
text([“abc”]):获取或者设置文本内容
html([“abc”]):获取或者设置html内容
attr(“id”,”abc”):获取或者设置元素的属性
css():获取或者设置元素的css央视,如果设置多个央视,参使用json格式
6.事件
click(function(){xxx}):点击事件,点击时执行function函数
burl():失去焦点事件
focus():获得焦点事件
change():切换时间
ready():文档就绪事件
7.效果
show():隐藏的元素显示
hide():显示的元素隐藏
toggle():切换显示状态,即隐藏的显示,显示的隐藏
8.JSON
josn是什么?
Josn是js提供的一种数据交换格式
格式:
Var person={
“name”:”zhangsan”,
“age”:18,
…
}
josn用{}抱起来,key为字符串,用双引号引起来,value可以是任意类型ket,value之间用”:”隔开,多个key,value之间用”,”隔开