jQuery是JavaScript的类库拥有非常丰富的插件,完善的ajax功能。
jQuery的历史
jQuery由美国人John Resig于2006年初创建,至今已吸引了来自世界各地的众多javascript高手加入其team。
jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。
jQuery能够使用户的html页保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需使用选择器查找即可。
2006 年 8 月发布了 jQuery1.0,第一个稳定版本,具有对 CSS 选择符、事件处理和 Ajax 交互的支持
2013 年 1 月发布了 jQuery1.9,CSS 的多属性设置,增强了 CSS3。 2013 年 5 月发布了 jQuery1.10,增加了一些功能。
2013 年 4 月发布了 jQuery2.0,5 月发布了 jQuery2.0.2,一个重大更新版本,不再支 持 IE6/7/8,体积更小,速度更快。
最新版本:jquery-3.5.1
下面是就jQuery的具体作用:
1 、取得页面中的元素。如果不使用JavaScript 库,遍历DOM (Document Object Model ,文档对象模型)树,以及查找HTML 文档结构中某个特殊的部分,必须编写很多行代码。jQuery 为准确地获取需要检查或操纵的文档元素,提供了可靠而富有效率的选择符机制。
2 、修改页面的外观。CSS 虽然为影响文档呈现的方式提供了一种强大的手段,但当所有浏览器不完全支持相同的标准时,单纯使用CSS 就会显得力不从心。 jQuery 可以弥补这一不足,它提供了跨浏览器的标准解决方案。而且,即使在页面已经呈现之后,jQuery 仍然能够改变文档中某个部分的类或者个别的 样式属性。
3 、改变页面的内容。jQuery 能够影响的范围并不局限于简单的外观变化,使用少量的代码,jQuery 就能改变文档的内容。可以改变文本、插入或翻转图像、对列表重新排序,甚至,对HTML 文档的整个结构都能重写和扩充——所有这些只需一个简单易用的API 。
4 、响应用户的页面操作。即使是最强大和最精心设计的行为,如果我们无法控制它何时发生,那它也毫无用处。jQuery 提供了截取形形色色的页面事件 (比如用户单击一个链接)的适当方式,而不需要使用事件处理程序搞乱HTML代码。此外,它的事件处理API 也消除了经常困扰Web 开发人员的浏览器不一 致性。
5 、为页面添加动态效果。为了实现某种交互式行为,设计者也必须向用户提供视觉上的反馈。jQuery 中内置的一批淡入、擦除之类的效果,以及制作新效果的工具包,为此提供了便利。
6 、无需刷新页面即可从服务器获取信息。这种编程模式就是众所周知的AJAX (Asynchronous JavaScript and XML ,异步JavaScript 和XML ),它能辅助Web 开发人员创建出反应灵敏、功能丰富的网站。jQuery 通过消除这一过程中的浏览器特定的复 杂性,使开发人员得以专注于服务器端的功能设计。
jQuery的特点
轻量级:经GZip压缩后传输的代码文件仅14KB,未经压缩传送的代码文件仅26KB
链式语法 :$("p.surprise").addClass("ohmy").show("slow");
CSS 1-3 选择器:支持CSS选择器选定DOM对象
跨浏览器:支持Internet Explorer 6+、Opera 9+、Firefox 1.5+、Safari 2+
简单:较其它JS库更容易入门,中、英文档很齐全
易扩展: JQuery UI 、 JQuery FX –已经有很完善的基于JQuery的用户界面库 和网页特效库
jQuery的知识点:
选择器:
选择器 是什么?
选择器 有特定语法规则(css选择器)的字符串
选择器 用来查找某个/些DOM元素: $(selector)
选择器 分类
选择器 基本
选择器 #id
选择器 tagName/*
选择器 .class
选择器 selector1,selector2,selector3: 并集
选择器 selector1selector2selector3: 交集
选择器 层次
选择器 找子孙后代, 兄弟元素
选择器 selector1>selector2: 子元素
选择器 selector1 selector2: 后代元素
选择器 过滤
选择器 在原有匹配元素中筛选出其中一些
选择器 :first
选择器 :last
选择器 :eq(index)
选择器 :lt
选择器 :gt
选择器 :odd
选择器 even
选择器 :not(selector)
选择器 :hidden
选择器 :visible
选择器 [attrName]
选择器 [attrName=value]
选择器 表单
选择器 :input
选择器 :text
选择器 :checkbox
选择器 :radio
选择器 :checked: 选中的
jQuery入口函数与Js入口函数的区别:
【注】js入口函数指的是:window.onload = function(){};
区别一:书写个数不同
Js入口函数只能出现一次,出现多次会存在事件覆盖的问题。
jQuery的入口函数,可以出现任意多次,并不会存在事件覆盖问题。
区别二:执行时机不同
Js入口函数是在所有的文件资源加载完成后,才执行。这些文件资源包括:页面文档、外部的js文件、外部的css文件、图片等。
jQuery的入口函数,是在文档加载完成后,就执行。文档加载完成指的是:DOM树加载完成后,就可以操作DOM了,不用等到所有的外部资源都加载完成。
文档加载的顺序:从上往下,边解析边执行。