简介
jQuery是一个快速、简介的JavaScript代码库。封装了JavaScript常用的功能代码,提供了一种简便的JavaScript操作方式,优化HTML文档操作、事件处理、动画设计和Ajax交互。
具有独特的链式语法,支持CSS选择器,兼容各种主流浏览器。
jQuery安装环境
直接引用jQuery
CDN引用
jQuery语法
$(匿名函数)
$(document).ready(function(){})
可以写为匿名函数$(function(){})
jQuery选择器
id选择器:$("#属性").方法
class选择器:$(".属性").方法
jQuery事件
鼠标事件、键盘事件、表单事件、文档/窗口事件
jQuery效果
隐藏显示
hide():隐藏元素
show();显示元素
toggle():切换显示、隐藏
淡入谈出
fadeIn(speed,callback);淡入已隐藏的元素
fadeOut(speed,callback);淡出可见元素
fadeToggle(speed,callback);淡出与谈入切换
fadeTo(speed,opacity(透明度),callback):设置透明度
滑动
slideDown(speed,callback):向下滑动元素
slideUp(speed,callback):向上滑动元素
slideToggle(speed,callback):向上滑动和向下滑动切换
动画
animate({params(css语句)},speed,callback)
停止动画
stop(stopAll,goToEnd)
Callback
回调函数
jQuery DOM操作
jQuery拥有可操作HTML元素和属性的强大方法,并且拥有操作DOM的能力和方法。
捕获
attr()方法可以获取属性值
attr(href,“链接地址”)链接地址会替代href的地址
设置
text()设置或返回所选元素的文本内容
()内无参则返回值,有参数则设置值。
html()设置或返回所选元素的内容(可以识别HTML代码
val()设置或返回所选表单的值
添加元素
append();在被选元素的结尾插入内容
prepend();在被选元素的开头插入内容
after();在被选元素之后插入内容
before();在被选元素之前插入内容
删除元素
remove();删除被选元素(及其子元素)
empty();从被选元素中删除子元素
CSS类
addClass();向被选元素添加一个或多个类
removeClass();从被选元素删除一个或多个类
toggleClass();对被选元素进行添加/删除类的切换操作
css();设置或返回样式属性
css()方法
尺寸
width();
height();
innerwidth();
innerheight();
outerwidth();
outerheight();
jQuery遍历
jQuery中的遍历指“移动”,是根据当前元素与其他元素的关系(祖先、后代、同胞)来选取查找HTML元素
祖先jQuery parent()方法
后代jQuery children()方法
同胞jQuery siblings()方法
过滤jQuery first()方法
first()方法;返回被选元素的首个元素
last();返回被选元素的最后一个元素
eq();返回被选元素带有指定索引号(从0开始)的元素
filter();规定一个标准。不匹配整个标准的元素会被删除,返回符合标准的元素
bot();与filter()相反,返回不匹配标准的元素
jQueryAJAX
$.get(URL,callback)方法通过HTTP GET请求从服务器上请求数据
$.post(URL,data,callback)方法通过HTTP POST请求从服务器上请求数据