jQuery学习
Posted 雷小喵
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery学习相关的知识，希望对你有一定的参考价值。
什么是jQuery?
jQuery是一个javascript函数库。
jQuery有以下功能：
1、html元素的选取
2、html元素操作
3、css操作
4、html事件函数
5、JavaScript特效和动画
jQuery的简单使用：
首先，我知道jQuery是一个JavaScript的函数库，那我们就先要在html中引入这个库。引入的时候我们可以直接把这个库下载的本地，也可以远程用链接引入。下面引入的方法是远程链接引入：
<head> <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script> </head>
基础语法：$(selector).action()
美元符号定义jQuery；选择符(selector)查询或查找html; jQuery的action()执行元素的操作。
$(document).ready(function(){ // 开始写 jQuery 代码... });
下面是一种简洁写法，与上面的写法相同：
$(function(){ // 开始写 jQuery 代码... });
jQuery选项器
jQuery选择器是基于元素id、类、类型、属性、属性值等查找或选择HTML元素，基于已经存在的cs选择器，之外还有一些自定义的选择器。jQuery中所有的选择器都以美元符号开头：￥()
1、元素选择器
基于元素名选取元素。
例如：在页面选取所有<p>元素：
$(document).ready(function(){ $("button").click(function(){ $("p").hide(); }); });
2、#id选择器
#id选择器通过HTML中id的属性选取指定的元素。注意：html中的id的属性是唯一的。
$(document).ready(function(){ $("button").click(function(){ $("#test").hide(); }); });
3、.class选择器
jQuery类选择器可以通过指定的class查找元素
$(document).ready(function(){ $("button").click(function(){ $(".test").hide(); }); });
jQuery事件
1、click（）事件
click()方法时当按钮点击事件被触发思考hi调用一个函数
$("p").click(function(){
$(this).hide();
});
下面不会再列出代码实例，因为代码实例大都相同，只需要把事件方法名换一下就好了。
2、dblclick()事件
dblclick()方法是当双击元素时，触发事件
3、mouseenter()事件
当鼠标穿过元素时，会触发
4、mouseleave()事件
当鼠标指针离开元素时，会触发
5、mousedown()事件
当鼠标指针移动到元素上方，并按下鼠标按键时，会触发
6、mouseup()事件
当在元素上方松开鼠标按钮，会触发
7、hover()事件
当鼠标移动到元素上方时，会触发
jQuery动画
animate() 方法用于创建自定义的动画。
语法：
$(selector).animate({params},speed,callback);
params参数顶一个形成动画的css属性，必须的；
speed参数规定效果时长。它可以取以下值：“slow”，"fast"或者毫秒，可选的；
callback参数是动画完成后所执行的函数名称，可选的。
$("button").click(function(){
$("div").animate({left:‘250px‘});//向右边移动250个像素
});
注：animate() 方法可以使用相对值。需要在值的前面加上+=或-=，也可以使用预定义的值。
以上是关于jQuery学习的主要内容，如果未能解决你的问题，请参考以下文章
Visual Studio 2012-2019的130多个jQuery代码片段。
markdown 在WordPress中使用jQuery代码片段