1. $是函数名 案例引入 1-2
代码在E:\java学习\jQuery\course\course1
start.html
$是函数名 1 -->
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>title>
<script type="text/javascript">
//自定义方法, 获取js中的dom对象 , $ 是一个函数的名称
/* function getDomObj( domId){
var obj = document.getElementById(domId);
return obj
} */
//之所以只用$作为函数名,是因为其有着很高的辨识度 2
function $( domId){
var obj = document.getElementById(domId);
return obj
}
//单击按钮获取 文本框的 value值
function fun1(){
// 通过js中的 id 获取dom对象
//var obj = document.getElementById("txt1");
//var obj = getDomObj("txt1");
var obj = $("txt1");
alert(obj.value);
}
function fun2(){
// 通过js中的 id 获取dom对象
//var obj = document.getElementById("txt2");
//var obj = getDomObj("txt2");
var obj = $("txt2");
alert(obj.value);
}
script>
head>
<body>
<input type="text" id="txt1" value="我是txt1" /> <br/>
<input type="text" id="txt2" value="我是txt2" /> <br/>
<input type="button" value="单击按钮 1" onclick="fun1()" /> <br/>
<input type="button" value="单击按钮 2" onclick="fun2()" /> <br/>
body>
html>2. jQuery是js库 3
库：相当于java的工具类，库是存放东西的， jQuery是存放js代码的地方， 放的用js代码写的function
官网地址：https://jquery.com
3. 为什么[why]使用 jQuery 3
非常重要的理由就是：它能够兼容市面上主流的浏览器，
IE 和 FireFox，Google 浏览器
处理 AJAX，创建异步对象是不同的，而 jQuery 能够使用一种方式在不同的浏览器创建 AJAX
异步对象。
3.1 其他优点： 3
（1）写少代码,做多事情【write less do more】
（2）免费，开源且轻量级的 js 库，容量很小
（3）兼容市面上主流浏览器，例如 IE，Firefox，Chrome
（4）能够处理 HTML/JSP/XML、CSS、DOM、事件、实现动画效果，也能提供异步 AJAX
功能
（5）文档手册很全，很详细
（6）成熟的插件可供选择，多种 js 组件，例如日历组件（点击按钮显示下来日期）
（7）出错后，有一定的提示信息
（8）不用再在 html 里面通过
3.2 例如：使用 JavaScript 定位 DOM 对象常用的三种方式： 3
（1）通过 ID 属性：document.getElementById()
（2）通过 class 属性：getElementsByClassName()
（3）通过标签名：document.getElementsByTagName()
上面代码可以看出 JavaScript 方法名太长了，大小写的组合太多了，编写代码效率，容易出 错。jQuery 分别使用(“.class 名”) , $(“标签名) 封装了上面的 js 方法。
4. DOM 对象 5
文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展标志语言的标准编程接口。
通过 DOM 对 HTML 页面的解析，可以将页面元素解析为元素节点、属性节点和文本节点，这些解析出的节点对象，即 DOM 对象。DOM 对象可以使用 JavaScript 中的方法。
5.获取 jQuery 4-5
官网下载地址：https://jquery.com/download/
jQuery 的不同版本中，2.xx 不再支持 IE6/7/8 浏览器。现阶段 IE6/7/8 已经是淘汰的，非主流。可以不用考虑兼容问题。
对于每一个同一版本号的 jQuery，其库又分为两个。一个是未压缩版，可查看源码，
开发时使用；一个是压缩版，将注释、空格均做了删除，将变量字符数减少，产品上线时使
用
6. 牛刀小试 5-6
编写 jQuery 的工具很多，能编写 HTML 的工具都支持 jQuery. 例如记事本，EditPlus,
webStorm, Visual Studio Code , HBuilder , HBuilderX , IDEA.
单独学习 jQuery 库使用，可以轻量的开发工具，例如 EditPlus , HBuilder,HbuilderX
编写项目可以使用集成开发工具，例如在 IDEA， Eclipse , MyEclipse ,WebStorm 等
第一个例子完成：浏览器完全装载 html 页面 DOM 后,显示一个提示信息框
代码在E:\java学习\jQuery\course\course1
hellojQuery.html
第一个jQuery代码示例 5
第一个例子完成：浏览器完全装载 html 页面 DOM 后,显示一个提示信息框 -->
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第一个例子title>
引入jquery库 -->
指定jquery的库文件位置， 使用相对路径，当前项目的js目录下的指定文件 -->
<script type="text/javascript" src="js/jquery-3.4.1.js">script>
<script type="text/javascript">
/*
1. $(document) , $是jQuery中的函数名称， document是函数的参数
作用是 document对象变成 jQuery函数库可以使用的对象。
2. ready：是jQuery中的函数， 是准备的意思， 当页面的dom对象加载成功后
会执行ready函数的内容。 ready 相当于js中的onLoad事件
3. function()自定义的表示onLoad后要执行的功能。
*/
$(document).ready(function(){
alert("hello jquery")
})
//上述代码还可以这样写 6
$(function(){
alert("hello jquery2")
})
script>
head>
<body>
body>
html>6.1 使用 jQuery，首先要将 jQuery 库引入。使用如下语句：
5. $(document)，将 DOM 对象 document 转换为 jQuery 对象。$(document).ready()函数是当
DOM 对象加载完毕后，马上执行的函数。
$(document).ready()与$()、jQuery()、window.jQuery()是等价的，所以$(document).ready()可以
写成 $(function() { alert(“Hello jQuery”) } );
