js与jquery
JavaScript 与 jQuery 的区别与联系
JavaScript 是一种脚本语言，用于在网页上实现动态交互功能。它是 Web 开发的核心技术之一，可以直接在浏览器中运行，也可以用于服务器端开发（如 Node.js）。
jQuery 是一个基于 JavaScript 的库，封装了常见的 DOM 操作、事件处理、动画效果等功能，简化了 JavaScript 的编写。
核心差异
原生 JavaScript
- 直接操作 DOM 和浏览器 API
- 需要手动处理跨浏览器兼容性问题
- 代码可能较为冗长，但性能更高
- 现代浏览器已原生支持大部分功能（如
querySelector、fetch）
jQuery
- 提供简洁的语法（如
$()选择器） - 内置跨浏览器兼容性解决方案
- 提供链式调用（如
$('div').hide().addClass('active')） - 体积较大（需加载库文件），在简单场景中可能性能略低
功能对比示例
DOM 选择
// JavaScript
document.querySelector('#element');
// jQuery
$('#element');事件绑定
// JavaScript
document.getElementById('btn').addEventListener('click', () => {
console.log('Clicked');
});
// jQuery
$('#btn').click(() => {
console.log('Clicked');
});AJAX 请求
// JavaScript (Fetch API)
fetch('/api/data')
.then(response => response.json())
.then(data => console.log(data));
// jQuery
$.get('/api/data', (data) => {
console.log(data);
});适用场景
使用原生 JavaScript
- 轻量级项目或性能敏感场景
- 现代浏览器环境（无需兼容旧版 IE）
- 学习底层 Web 技术
使用 jQuery
- 快速开发兼容性要求高的项目
- 需要大量 DOM 操作或动画效果
- 旧代码维护或传统项目
现代替代方案
随着现代浏览器的发展，许多 jQuery 功能已被原生 API 替代：
- 选择器：
querySelector/querySelectorAll - AJAX：
fetch或axios库 - 动画：CSS3 动画或
Web Animations API
但 jQuery 仍广泛用于遗留系统或需要快速开发的场景。
