整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
Query 是为事件处理特别设计的。
什么是事件？
页面对不同访问者的响应叫做事件。
事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。
实例：
在元素上移动鼠标。
选取单选按钮
点击元素
在事件中经常使用术语"触发"（或"激发"）例如： "当您按下按键时触发 keypress 事件"。
常见 DOM 事件：
| 鼠标事件 | 键盘事件 | 表单事件 | 文档/窗口事件 |
|---|---|---|---|
| click | keypress | submit | load |
| dblclick | keydown | change | resize |
| mouseenter | keyup | focus | scroll |
| mouseleave | blur | unload |
jQuery 事件方法语法
在 jQuery 中，大多数 DOM 事件都有一个等效的 jQuery 方法。
页面中指定一个点击事件：
$("p").click();
下一步是定义什么时间触发事件。您可以通过一个事件函数实现：
$("p").click(function(){// 动作触发后执行的代码!!});
常用的 jQuery 事件方法
$(document).ready()
$(document).ready() 方法允许我们在文档完全加载完后执行函数。该事件方法在 jQuery 语法 章节中已经提到过。
click()
click() 方法是当按钮点击事件被触发时会调用一个函数。
该函数在用户点击 HTML 元素时执行。
在下面的实例中，当点击事件在某个 <p> 元素上触发时，隐藏当前的 <p> 元素：
实例
$("p").click(function(){ $(this).hide();});
dblclick()
当双击元素时，会发生 dblclick 事件。
dblclick() 方法触发 dblclick 事件，或规定当发生 dblclick 事件时运行的函数：
实例
$("p").dblclick(function(){ $(this).hide();});
尝试一下 »
mouseenter()
当鼠标指针穿过元素时，会发生 mouseenter 事件。
mouseenter() 方法触发 mouseenter 事件，或规定当发生 mouseenter 事件时运行的函数：
实例
$("#p1").mouseenter(function(){alert('您的鼠标移到了 id="p1" 的元素上!');});
尝试一下 »
mouseleave()
当鼠标指针离开元素时，会发生 mouseleave 事件。
mouseleave() 方法触发 mouseleave 事件，或规定当发生 mouseleave 事件时运行的函数：
实例
$("#p1").mouseleave(function(){alert("再见，您的鼠标离开了该段落。");});
尝试一下 »
mousedown()
当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。
mousedown() 方法触发 mousedown 事件，或规定当发生 mousedown 事件时运行的函数：
实例
$("#p1").mousedown(function(){alert("鼠标在该段落上按下！");});
尝试一下 »
mouseup()
当在元素上松开鼠标按钮时，会发生 mouseup 事件。
mouseup() 方法触发 mouseup 事件，或规定当发生 mouseup 事件时运行的函数：
实例
$("#p1").mouseup(function(){alert("鼠标在段落上松开。");});
尝试一下 »
hover()
hover()方法用于模拟光标悬停事件。
当鼠标移动到元素上时，会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时，会触发指定的第二个函数(mouseleave)。
实例
$("#p1").hover(function(){alert("你进入了 p1!"); }, function(){alert("拜拜! 现在你离开了 p1!"); });
focus()
当元素获得焦点时，发生 focus 事件。
当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。
focus() 方法触发 focus 事件，或规定当发生 focus 事件时运行的函数：
实例
$("input").focus(function(){ $(this).css("background-color","#cccccc");});
尝试一下 »
blur()
当元素失去焦点时，发生 blur 事件。
blur() 方法触发 blur 事件，或规定当发生 blur 事件时运行的函数：
实例
$("input").blur(function(){ $(this).css("background-color","#ffffff");});
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！
节我们学习 jQuery 中的事件的使用，jQuery 是专门为响应 HTML 页面中的事件而设计的。我们在使用时，需要遵循以下原则：
首先我们要知道什么是事件，页面对不同访问者的响应叫做事件，例如点击某个按钮，选择单选框或复选框，滑动鼠标等，这些都可以称为事件。
在 jQuery 中，大多数 DOM 事件都有一个相应的 jQuery 方法。例如我们前面提到过的点击事件的对应的方法为 click() 方法。
当我们点击元素时，会发生 click 点击事件，这需要用到 click() 方法。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery_侠课岛(9xkd.com)</title>
<script src="jquery-3.5.1.min.js"></script>
<script>
$(function(){
$("button").click(function(){
alert("hello, xkd!");
});
});
</script>
</head>
<body>
<div>
<button>点击按钮</button>
</div>
</body>
</html>
在浏览器中的演示效果：
期，英国公共部门信息网站 GOV.UK 前端开发主管 Matt Hobbs 宣布该公司删除了 jQuery 作为所有前端应用程序的依赖项，这意味着“在所有 13 个 FE 应用程序中，JS 大小减少了 32 KB（31% ～49% 之间）”。
Matt 也在推特上分享了几组数据，说明了在删除 jQuery 后一些关键指标得到了优化。
“这些用户会遇到严重不利的网络和设备条件，每一次性能提升对他们来说尤其重要。”Matt 说道。
根据 Matt 说法，删除 jQuery 的本意是清理技术债。“它最初是为了支持浏览器而存在的，但随着时间的推移，情况发生了变化，所以 bits 可以被删除。我想在这之后会重新评估，看看还有什么是不再需要的。” Matt 表示。
jQuery 是一套跨浏览器的 JavaScript 库，可以简化 HTML 与 JavaScript 之间的操作。截至 2021 年，有将近 84% 的移动页面使用 jQuery。jQuery 是最受欢迎的 JavaScript 库之一，它的一些操作已经反映在标准 Web API 中。
JQuery 创建于 2006 年，主要是为了帮助开发者处理当时浏览器的不足。当时谷歌浏览器还未流行，人们饱受 Internet Explorer 之苦。而 JQuery 开发者可以使用 CSS 选择器和函数可以轻松地遍历和操作 DOM，
此外，JQuery 还提供了一些开箱即用的函数来做动画 DOM 元素，而无需弄乱 CSS。在没有 jQuery 之前发出 AJAX 请求很麻烦，但使用 JQuery 只需几行代码即可完成。JQuery 提供了一个可以在大多数浏览器上工作的 API，这在当时使用 JavaScript 是很难实现的。
但在过去的几年里，JavaScript 已经成熟了很多，它支持很多新的 API，其社区也构建了很多库来填补 jQuery 可能留下的任何空白。
现在，开发者几乎可以在原生 JavaScript 中做任何 jQuery 可以做的事情。例如，可以使用带有 querySelector 和 querySelectorAll 的 CSS 选择器语法来选择元素，使用 classList API 在元素上添加、删除和切换类，使用 addEventListener 将事件处理程序附加到 DOM 元素和窗口等等。
同时随着 Angular、Vue 和 React 等框架的出现和流行，一直未有特别创新的 jQuery 更显“老态”。“对我来说，他们 (jQuery ) 就像是那个随着时代变迁没有更新知识的老灰胡子。”有网友直言。
“现在，大多数事情都不再需要 jQuery 了。”有网友评论道，“我个人发现普通的 JS API 和 fetch 甚至比 jQuery 的东西更干净。人们仍然出于习惯使用 jQuery，是因为摆脱它需要做很多工作。”
近几年，业内对于“jQuery 是否已死”的讨论一直没停过。实际上，一些大型、资金充足的网站已经“用脚投票”，正在逐渐摆脱对 jQuery 的依赖。
2018 年，GitHub 宣布从 GitHub.com 的前端代码中完全移除了 jQuery。“早期，jQuery 对我们意义重大。”GitHub 前端工程团队在方式发布的文章里表示。“在 GitHub 的早期阶段，jQuery 让小型的开发团队能够快速进行原型设计并开发出新功能，而无需专门针对每个 Web 浏览器调整代码。”
但随着 GitHub 成长为一家拥有数百名工程师的公司，jQuery 带来的价值已经随着时间的推移而下降。比如技术债会随着依赖项的增多而增长，给企业带来很大的维护成本。因此，GitHub 最终决定删除 jQuery。不过，GitHub 没有选择另外的库或框架，而是使用标准的浏览器 API 来实现。
不只 GitHub，Bootstrap 最新版本也将删除 jQuery。
尽管被认为已经过时，但 jQuery 仍然是占主导地位的 JavaScript 库。今天的开发人员可能没有意识到在使用 jQuery，因为它被嵌入在了许多大型开源项目里面，其中最著名的就是 WordPress。
“大多数网站都不需要复杂的开发框架，它们大多是具有一些动态行为的静态网站，这种网站通常用 WordPress 编写。jQuery 在这个场景下仍然很流行，因为它既简单又有效，人们觉得没必要停止使用它。”jQuery 开发者 Micha Gobiowski-Owczarek 在接受外媒采访时说道。
Micha Gobiowski-Owczarek 也明确表示，为了不与浏览器冲突，jQuery 不会修改原生原型，而是用 jQuery 包装器对象包装 DOM 节点，每个操作都会创建一个新的包装器对象。大多数情况下，这并不重要，但对于具有大量 DOM 操作的、非常复杂的应用程序来说，可能会成为一个问题。
未来的很长一段时间里，jQuery 还继续会是 WordPress 的一部分，因为它很难在不破坏向后兼容性的情况下将它删除。但一些改变已经发生，如 WordPress 创建的 Gutenberg 编辑器不依赖于 jQuery。
随着时间的推移， WordPress 肯定会逐步更新技术，这是一个渐进的过程，jQuery 的最终去留也很难说。但不可否认的是，jQuery 为前端带来了重大的影响。
参考链接：
https://thenewstack.io/why-outdated-jquery-is-still-the-dominant-javascript-library/
*请认真填写需求信息，我们会在24小时内与您取得联系。
