框架实战课件01-邂逅jQuery、属性和DOM操作.pdf

邂逅jQuery

刘军liujun

目录

1什么是jQuery

content

2认识jQuery对象

3jQuery的整体架构

4jQuery操作属性

5jQuery操作DOM

coderwhy认识jQuery

◼jQuery读音为：/ˈdʒeɪkwɪəri/（简称：jQ），是一个快速、小型且功能丰富的JavaScript库，官网对jQuery的描述：

使HTML文档遍历、操作、事件处理、动画和Ajax之类的事情变得更加简单。

具有易于使用的API，可在多种浏览器中使用。

jQuery结合多功能性和可扩展性，改变了数百万人编写JavaScript的方式。

◼jQuery官网：/

coderwhy库(library)和框架(framework)的概念

◼随着JavaScript的普及，以及越来越多人使用JavaScript来构建网站和应用程序

JavaScript社区认识到代码中存在非常多相同的逻辑是可复用的。

因此社区就开始对这些相同的逻辑的代码封装到一个JavaScript文件中。

这个封装好的JavaScript文件就可称为JavaScript库或JavaScript框架。

◼库(library)

JavaScript库是一个预先编写好并实现了一些特定功能的代码片段的集合。

一个库中会包含许多的函数、变量等，可根据需求引入到项目中使用。

一些常见的库有jQuery、Day.js、Lodash和React等

◼框架（framework）

JavaScript框架是一个完整的工具集，可帮助塑造和组织您的网站或应用程序。

提供一个结构来构建整个应用程序，开发人员可以在结构的规则内更安全、更高效地工作。

一些更常见的框架有：Bootstrap、Angular、Vue、Next.js等。

coderwhyjQuery优点与缺点

◼jQuery的优点

易于学习：相对于其它的前端框架，jQuery更易于学习，它支持JavaScript的编码风格。

少写多做（Writeless,domore）

✓jQuery提供了丰富的功能(DOM操作、过滤器、事件、动画、Ajax等)。

✓可以编写更少可读的代码来提高开发人员的工作效率。

优秀的API文档：jQuery提供了优秀的在线API文档。

跨浏览器支持：提供出色的跨浏览器支持(IE9+)，无需编写额外代码。

◼jQuery的缺点：

jQuery代码库一直在增长（自jQuery1.5起超过200KB）

不支持组件化开发

jQuery更适合DOM操作，当涉及到开发复杂的项目时，jQuery能力有限。

coderwhyjQuery起源和历史

◼早在2005年8月22日，JohnResigfirsthintsofaJavaScriptlibrarytouseCSSselectors（SelectorsinJavaScript）withamore

succinctsyntaxthanexistinglibraries（Behaviour）。

JohnResig首次提出支持CSS选择器的JavaScript库，其语法比现有库（例如：Behaviour）更简洁。

◼在2006年之前，JohnResig（一名从事自己项目的Web开发人员）对编写跨浏览器的JavaScript感到非常繁琐。

2006年1月16日，JohnResig在BarCamp的演讲中介绍了他的新库(jQuery