菜鸟教程jquery

jQuery 简介

jQuery 是一个快速、简洁的 JavaScript 库，简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。其核心理念是“写得更少，做得更多”，适合快速开发前端功能。

jQuery 安装

从官网下载 jQuery 文件（如 jquery-x.x.x.min.js）或通过 CDN 引入：

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

基础语法

通过 $ 或 jQuery 选择元素并执行操作：

$(selector).action();

• selector：CSS 选择器（如 #id、.class、tag）。
• action：jQuery 方法（如 hide()、click()）。

常用方法

DOM 操作

$("#demo").text("Hello"); // 修改文本  
$("#demo").html("<b>Hello</b>"); // 修改HTML  
$("#demo").val(); // 获取表单值

事件处理

$("#btn").click(function() {  
  alert("Clicked!");  
});

CSS 操作

$("#demo").css("color", "red"); // 修改样式  
$("#demo").addClass("active"); // 添加类

动画效果

$("#box").hide(1000); // 隐藏  
$("#box").fadeIn(500); // 淡入

Ajax 请求

$.get("url", function(data) {  
  console.log(data);  
});  

$.post("url", {name: "John"}, function(data) {  
  alert(data);  
});

链式调用

jQuery 支持链式调用：

$("#demo").css("color", "red").slideUp(500).slideDown(500);

注意事项

• 确保 DOM 加载完成后执行代码：

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

• 使用最新版本以获得更好的性能和安全性。

如需深入学习，可访问 jQuery 官网 或查阅菜鸟教程的详细示例。