1.为什么要使用jQuery
在用js写代码时，会遇到一些问题：
window.onload 事件有事件覆盖的问题，因此只能写一个事件。
代码容错性差。
浏览器兼容性问题。
书写很繁琐，代码量多。
代码很乱，各个页面到处都是。
动画效果很难实现。
jQuery的出现，可以解决以上问题。
什么是 jQuery
jQuery 是 js 的一个库，封装了我们开发过程中常用的一些功能，方便我们调用，提高开发效率。
js库是把我们常用的功能放到一个单独的文件中，我们用的时候，直接引用到页面里即可。
关于jQuery的相关资料：
官网：http://jquery.com/
官网API文档：http://api.jquery.com/
汉化API文档：http://www.css88.com/jqapi-1.9/
学习jQuery，主要是学什么
初期，主要学习如何使用jQuery操作DOM，其实就是学习jQuery封装好的那些功API。
这些API的共同特点是：几乎全都是方法。所以，在使用jQuery的API时，都是方法调用，也就是说要加小括号()，小括号里面是相应的参数，参数不同，功能不同。
jQuery的第一个代码
用原生js来实现下面代码效果：
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title></title> ???<style type="text/css"> ???????div{ ???????????width: 100px; ???????????height: 100px; ???????????background-color: green; ???????????margin-top: 20px; ???????????display: none; ???????} ???</style> ???<script type="text/javascript"> ???????window.onload = function(){ ???????????var oBtn = document.getElementsByTagName(‘button‘)[0]; ???????????var divArr = document.getElementsByTagName(‘div‘); ???????????oBtn.onclick = function () { ???????????????????????for (var i = 0; i < divArr.length; i++) { ???????????????????????????divArr[i].style.display = "block"; ???????????????????????????divArr[i].innerHTML = "赵云"; ???????????????????????????} ????????????} ???????} ???</script> ???</head><body> ???????<button>操作</button> ???<div></div> ???<div></div> ???<div></div> ???</body></html>如果用 jQuery 来写，保持其他的代码不变，<script>部分的代码修改为：（需要提前引入 ）
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title></title> ???<style type="text/css"> ???????div{ ???????????width: 100px; ???????????height: 100px; ???????????background-color: green; ???????????margin-top: 20px; ???????????display: none; ???????} ???</style></head><body> ???<button>操作</button> ???<div></div> ???<div></div> ???<div></div> ???<script type="text/javascript" src="jquery-3.3.1.js"></script> ???<script type="text/javascript"> ???????$(document).ready(function(){ ???????????// 获取dom元素 ???????????var oBtn = $(‘button‘); //根据标签名获取元素 ???????????var oDiv = $(‘div‘); //根据标签名获取元素 ???????????oBtn.click(function(){ ???????????????oDiv.show(1000);//显示盒子 ???????????????oDiv.html(‘赵云‘); // 设置内容 ???????????});//事件是通过方法绑定的 ???????}) ???</script> ???</body></html>jQuery 的两大特点
链式编程：比如
.show()和.html()可以连写成.show().html()。隐式迭代：隐式 对应的是 显式。隐式迭代的意思是：在方法的内部进行循环遍历，而不用我们自己再进行循环，简化我们的操作，方便我们调用。
jQuery 的使用
使用 jQuery 的基本步骤
（1）引包
（2）入口函数
（3）功能实现代码（事件处理）
如图：
01-jQuery的介绍
原文地址：https://www.cnblogs.com/majj/p/9111098.html