【无标题】Jquery入门

了解 3W1H 的含义
1.jQuery What?是什么？

了解 3W1H 的含义
1.jQuery What?是什么？

*JavaScript库：封装了很多JS代码（类库） EXjs

*JavaScript库
Prototype:是最早成型的JS库之一，对于JS的内置对象做了大量的扩展。
Do jo：提供了很多奇特JS库没有提供的功能。例如：离线存储的API，生成图的 组件等等。
YUI：是由Yahoo公司开发的一套完备的，扩展性良好的富交互网页程序工作集。
Ext JS：原本是对YUI的一个扩展，主要用于创建前端用户界面。
Moo Tools：是一套轻量、简洁、模拟化和面向对象的JS框架。
jQuery：同样是一个轻量级的库，拥有强大的选择器等更多优点，吸引了更多开发 者去学习使用它。
*官方地址：http://jquery.com/

2.Why?为什么要学习？
查看官方jQueryLOGO：理念write less，do more
为了简化JavaScript开发：选择器、CSS、HTML事件处理、JS动画、浏览器兼容、丰富插件

3.Where?哪些情况下用？
中大型网站开发
是一些前端框架的基础，比如EasyUI，Bootstrap

4.How?怎么用？
工具：HBuilderX
案例1：点击按钮获取输入框中的值（JS对比jQuery）
使用jQuery步骤
1.下载jQuery库
开发版本：jquery-3.3.1.js
生产版本：jquery-3.3.1.min.js
2.引入：将js文件复制到项目中
3.使用

jQuery的文件的结构

1.打开jQuery库查看后 有一个基本架构
.function(){}())

上述这种结构称为自执行函数结构，作用就是自己定义调用自己自动执行

自执行函数也叫立执行函数 ，是将函数的声明和调用合并在一起
自执行函数的定义 ——> 闭合函数

2.Why?为什么要学习？
查看官方jQueryLOGO：理念write less，do more
为了简化JavaScript开发：选择器、CSS、HTML事件处理、JS动画、浏览器兼容、丰富插件

3.Where?哪些情况下用？
中大型网站开发
是一些前端框架的基础，比如EasyUI，Bootstrap

4.How?怎么用？
工具：HBuilderX
案例1：点击按钮获取输入框中的值（JS对比jQuery）
使用jQuery步骤
1.下载jQuery库
开发版本：jquery-3.3.1.js
生产版本：jquery-3.3.1.min.js
2.引入：将js文件复制到项目中
3.使用

jQuery的文件的结构
1.打开jQuery库查看后 有一个基本架构
• (function(){}())

上述这种结构称为自执行函数结构，作用就是自己定义调用自己自动
自执行函数也叫立执行函数 ，是将函数的声明和调用合并在一起
自执行函数的定义 ——> 闭合函数

函数 （需要手动调用）

function add() {
alert(123)
}
// 手动调用
// add();
// 1.参数为匿名函数时，意思：加载函数 $(function(){});
// 2.参数为字符串时，有两层意思
// 2.1 获取页面元素（选择器） $("#id") $(".class")
// 2.2 创建标签 $("");
// 3.参数为DOM对象（js对象） 意思：转换
* $(function(){}) 加载函数
* $(“选择器”)
* $(“标签”)
* $(DOM对象) 转换