jQuery入门

---恢复内容开始---

1、简介:

  jQuery是一个JavaScript函数库,轻量级,写的少,做的多的JavaScript函数库。(jQuery2以上不支持IE6、7、8。jQuery1.9支持)

2、jQuery 版本:

  Production version(用于实际的网站中,已被压缩和精简)Development version(测试和开发,可读代码)

  使用方式:<head> <script src="jquery-3.2.1.min.js"></script> </head> 

  或者引用CDN库  <head><script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script></head>

3、功能:

  html的元素选取、html的元素操作、html dom遍历和修改、js特效和动画效果、css操作、html事件操作、ajax异步请求方式。

4、语法:

  $(selector).action()        $:定义jQuery,selector:查询和查找的html元素,action()执行对元素的操作。

  $(document).ready(function(){//jQuery代码}):所有的jQuery代码在文档加载完之后进行。所以jQuery函数位于document ready函数中。

5、选择器:

  id、class、类型、属性、属性值、元素组选择器/或者将jQuery放于独立的js文件中,通过src加载使用。

6、jQuery事件:

  6.1、页面对不同访问者的响应叫做事件。事件处理程序是指当html中发生某些事件时所调用的方法。

  6.2、常见的DOM事件:click dbclickmouseentermouseleavekeypresskeydownkeyupsubmitchangefocuslurload esizescrollunload

  6.3、大部分DOM事件都有一个等效的jQuery方法。

  6.4、常用的jQuery方法:click()、dbclick()、mouseenter()、mouseleave()、mousedown()、mouseup()、hover()、focus()、blur()

7、jQuery效果

显示隐藏

  隐藏:$(selector).hide(speed,callback);  speed:slow 、fast、毫秒  callback:隐藏完成后执行的函数名称

  显示:$(selector).show(speed,callback);

  显示/隐藏$(selector).toggle(speed,callback);

淡入淡出

  淡入:$(seclector).fadeIn(speed,callback)  淡入已隐藏的元素。speed:slowfast毫秒

  淡出:$(selcetor).fadeout(speed,callback)

  淡入淡出 :fadeToggle()

  渐变为给定的不透明度:$(selector).fadeTo(speed,opacity,callback);opacity为淡入淡出设定的不透明度,值界于0~1之间。

滑动

  向下滑动元素:slideDown()

  向上滑动元素:slideUp()

  向上、下滑动元素:slideToggle()

动画

  创建自定义动画animate():$(selector).animate({params},speed,callback);  params:定义形成动画的css属性,可有多个属性。

  停止动画:$(selector).stop(stopAll,goToEnd);

jQuery链:Chaining 在一条语句中运用多个jQuery方法。

  

  

---恢复内容结束---

原文地址:https://www.cnblogs.com/xiaoyifenger/p/7931028.html