jquery用法

jQuery 基础用法

jQuery 是一个快速、简洁的 JavaScript 库，简化了 DOM 操作、事件处理、动画等任务。以下是其核心用法：

引入 jQuery

通过 CDN 引入最新版本（需联网）：

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

选择器

通过 CSS 选择器获取元素：

$("p")          // 选择所有 <p> 元素  
$("#myId")      // 选择 id="myId" 的元素  
$(".myClass")   // 选择 class="myClass" 的元素  

DOM 操作

修改元素内容或属性：

$("#myId").text("新内容");       // 修改文本  
$("#myId").html("<b>加粗</b>");  // 修改 HTML  
$("img").attr("src", "new.jpg"); // 修改属性  

事件处理

绑定点击事件：

$("#btn").click(function() {  
    alert("按钮被点击");  
});  

动画效果

隐藏/显示元素：

$("#box").hide(500);    // 500ms 内隐藏  
$("#box").show(500);    // 500ms 内显示  
$("#box").toggle(500);  // 切换显示状态  

AJAX 请求

发送 GET 请求：

$.get("url", function(data) {  
    console.log("返回数据:", data);  
});  

jQuery 链式调用

支持连续操作同一组元素：

$("p").css("color", "red").slideUp(200).slideDown(200);  

实用工具方法

遍历数组或对象：

$.each([1, 2, 3], function(index, value) {  
    console.log(index + ": " + value);  
});  

注意事项

• 使用 $(document).ready() 确保 DOM 加载完成后执行代码：

  $(document).ready(function() {  
    // 初始化代码  
  });  

• 避免过度使用动画，可能影响性能。
• 检查 jQuery 版本兼容性，部分方法在新版本中已被弃用。