jquery面试题
jQuery 基础概念
jQuery 是一个快速、简洁的 JavaScript 库，简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。它的核心特点是“写得更少，做得更多”。
选择器是 jQuery 的核心功能之一，通过 CSS 选择器语法可以快速定位 DOM 元素。例如 $("#id") 或 $(".class")。
链式调用是 jQuery 的另一大特点，允许在单个语句中执行多个操作，例如 $("#id").hide().fadeIn()。
常用方法
$(document).ready() 用于确保代码在 DOM 完全加载后执行。替代原生 JavaScript 的 window.onload，但不会等待图片等资源加载。
$.ajax() 是 jQuery 提供的 Ajax 方法，支持异步请求。示例：
$.ajax({
url: "test.html",
success: function(result){
$("#div1").html(result);
}
});animate() 方法用于创建自定义动画，可以控制 CSS 属性的逐步变化。例如：
$("div").animate({left: '250px'});事件处理
on() 方法是 jQuery 中推荐的事件绑定方式，支持动态元素和多个事件。示例：
$("#btn").on("click", function(){
alert("Button clicked");
});事件委托通过将事件绑定到父元素来提高性能，尤其适用于动态添加的元素。例如：
$("#parent").on("click", ".child", function(){
// 处理子元素点击
});DOM 操作
append() 和 prepend() 分别用于在元素内部末尾和开头插入内容。after() 和 before() 则在元素外部插入内容。
remove() 会删除元素及其绑定的事件，而 detach() 保留事件数据以便重新附加。
clone() 方法创建元素的副本，参数 true 表示深度复制包括事件和数据。
效果与动画
show() 和 hide() 控制元素的显示隐藏，可指定速度参数。toggle() 在两种状态间切换。
fadeIn() 和 fadeOut() 实现淡入淡出效果，slideUp() 和 slideDown() 提供滑动效果。
delay() 可用于在动画队列中设置暂停，例如：
$("#box").fadeIn().delay(1000).fadeOut();实用工具
$.each() 用于遍历数组或对象，比原生循环更简洁：
$.each([1,2,3], function(index, value){
console.log(value);
});$.extend() 合并多个对象，常用于插件开发或配置扩展。$.trim() 去除字符串两端空格。
$.grep() 过滤数组，$.map() 转换数组元素，提供函数式编程支持。
性能优化
选择器优化应尽量具体化，避免通用选择器如 $("*")。ID 选择器最快，其次是类选择器。
缓存 jQuery 对象避免重复查询 DOM：
var $elem = $("#elem");
$elem.hide();
$elem.show();使用最新版本 jQuery 以获得性能改进。压缩版（minified）减少文件大小提升加载速度。
事件委托减少事件处理器数量，尤其对动态内容或列表项有益。
常见插件
jQuery UI 提供官方交互组件如拖拽、排序、日期选择器等。需要额外引入 CSS 和 JavaScript 文件。
Validation 插件实现表单验证，支持自定义规则和错误提示。典型用法：
$("#form").validate({
rules: {
name: "required",
email: {
required: true,
email: true
}
}
});DataTables 插件增强 HTML 表格功能，支持分页、排序和搜索。只需简单初始化：
$('#table').DataTable();版本差异
jQuery 1.x 支持 IE6-8，2.x 及以上放弃对旧版 IE 的支持。3.x 进一步优化性能并精简 API。
迁移注意事项：.bind()、.delegate() 被 .on() 取代；.unbind()、.die() 由 .off() 替代。
新版本增加 Promise 支持，改进 Deferred 对象，使异步操作处理更符合标准。
与其他库共存
jQuery.noConflict() 方法解决 $ 符号冲突问题，例如：
var jq = jQuery.noConflict();
jq(document).ready(function(){
jq("button").click(function(){
jq("p").text("jQuery is still working!");
});
});与现代框架（如 React、Vue）配合时，通常避免直接操作 DOM。jQuery 更适合传统多页应用而非单页应用。
