jQuery介绍:
jQuery 是一个快速,小巧,功能丰富的 JavaScript 库。 它通过易于使用的 API 在大量浏览器中运行,使得 HTML 文档遍历和操作,事件处理,动画和 Ajax 变得更加简单。 通过多功能性和可扩展性的结合,jQuery 改变了数百万人编写 JavaScript 的方式。
别走呀!!!文章结尾有教程的哦!!!
为什么使用 jQuery
非常重要的理由就是:它能够兼容市面上主流的浏览器, IE 和 FireFox,Google 浏览器处理 AJAX,创建异步对象是不同的,而 jQuery 能够使用一种方式在不同的浏览器创建 AJAX异步对象。
其他优点:
(1)写少代码,做多事情【write less do more】
(2)免费,开源且轻量级的 js 库,容量很小
(3)兼容市面上主流浏览器,例如 IE,Firefox,Chrome
(4)能够处理 HTML/JSP/XML、CSS、DOM、事件、实现动画效果,也能提供异步 AJAX
功能
(5)文档手册很全,很详细
(6)成熟的插件可供选择,多种 js 组件,例如日历组件(点击按钮显示下来日期)
(7)出错后,有一定的提示信息
(8)不用再在 html 里面通过<script>标签插入一大堆 js 来调用命令了
DOM 对象
1.文档对象模型(Document Object Model,简称 DOM),是 W3C 组织推荐的处理可扩展标志语言的标准编程接口。
2.通过 DOM 对 HTML 页面的解析,可以将页面元素解析为元素节点、属性节点和文本节点,这些解析出的节点对象,即 DOM 对象。DOM 对象可以使用 JavaScript 中的方法。
JavaScript 对象和 jQuery 对象
1.用 JavaScript 语法创建的对象叫做 JavaScript 对象, JavaScript 对象只能调用 JavaScript对象的 API。
2.用 JQuery 语法创建的对象叫做 JQuery 对象, jQuery 对象只能调用 jQuery 对象的 API。jQuery 对象是一个数组。在数组中存放本次定位的 DOM 对象。
3.JQuery 对象与 JavaScript 对象是可以互相转化的,一般地,由于 Jquery 用起来更加方便,
我们都是将 JavaScript 对象转化成 Jquery 对象
牛刀小试
1.编写 jQuery 的工具很多,能编写 HTML 的工具都支持 jQuery. 例如记事本,EditPlus, webStorm, Visual Studio Code , HBuilder , HBuilderX , IDEA.
2.单独学习 jQuery 库使用,可以轻量的开发工具,例如 EditPlus , HBuilder,HbuilderX
3.编写项目可以使用集成开发工具,例如在 IDEA, Eclipse , MyEclipse ,WebStorm 等
第一个例子完成:浏览器完全装载 html 页面 DOM 后,显示一个提示信息框
实现步骤:
1. 使用 HBuilder 或 HbuilderX, idea 都可以,以 HbuilderX 为工具,创建一个项目(名称:
jquery-course),给项目选择一个文件存放目录。
2. 在项目中再创建一个目录
右键项目名称—新建—目录,常用名称为 js
3.拷贝下载的 jQuery.js 文件到目录
4. 使用 jQuery,首先要将 jQuery 库引入。使用如下语句:
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
5. $(document),将 DOM 对象 document 转换为 jQuery 对象。$(document).ready()函数是当DOM 对象加载完毕后,马上执行的函数。
$(document).ready()与$()、jQuery()、window.jQuery()是等价的,所以$(document).ready()可以写成 $(function() { alert(“Hello jQuery”) } );
6. 完整代码
教程指路:
课程简介:
jQuery是优秀的JavaScript框架,能使用户更方便地处理HTML Documents、events、实现动画效果,并且方便地为网站提供Ajax交互。本视频教程循序渐进地对jQuery的各种选择器、函数和方法调用进行了详细的讲解,更结合了大量的案例。