select jquery

jQuery 选择器语法

jQuery 选择器用于选取 HTML 元素，语法基于 CSS 选择器，并扩展了更多功能。基本语法为 $("selector")，其中 selector 可以是元素名称、ID、类名或属性等。

基本选择器

$("p")
选取所有 <p> 元素。

$("#id")
选取 ID 为 id 的元素。

$(".class")
选取所有类名为 class 的元素。

组合选择器

$("div, p")
选取所有 <div> 和 <p> 元素。

$("div.class")
选取类名为 class 的 <div> 元素。

层次选择器

$("div p")
选取 <div> 内所有 <p> 元素（后代）。

$("div > p")
选取 <div> 的直接子元素 <p>。

属性选择器

$("[href]")
选取所有带有 href 属性的元素。

$("[href='value']")
选取 href 属性等于 value 的元素。

过滤选择器

$("p:first")
选取第一个 <p> 元素。

$("p:last")
选取最后一个 <p> 元素。

$("p:even")
选取偶数位置的 <p> 元素（索引从 0 开始）。

$("p:odd")
选取奇数位置的 <p> 元素。

表单选择器

$(":input")
选取所有 <input>、<textarea>、<select> 和 <button> 元素。

$(":text")
选取所有 type="text" 的 <input> 元素。

$(":checked")
选取所有被选中的复选框或单选按钮。

动态操作

$("p").hide()
隐藏所有 <p> 元素。

$("#id").html("new content")
设置 ID 为 id 的元素的 HTML 内容。

$(".class").css("color", "red")
设置类名为 class 的元素的文字颜色为红色。

事件绑定

$("button").click(function() { alert("Clicked"); })
为所有 <button> 元素绑定点击事件。

$("input").change(function() { console.log("Value changed"); })
为所有 <input> 元素绑定值改变事件。

AJAX 请求

$.get("url", function(data) { console.log(data); })
发送 GET 请求并处理响应数据。

$.post("url", { key: "value" }, function(data) { console.log(data); })
发送 POST 请求并传递数据。

链式调用

$("p").css("color", "blue").slideUp(2000).slideDown(2000)
链式调用多个方法，依次改变颜色、上滑、下滑。

注意事项

确保在文档加载完成后执行 jQuery 代码：

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

或简写为：

$(function() {
  // jQuery 代码
});