jQuery 语法

使用 jQuery,您可以选取(查询)HTML 元素并对它们执行“操作”。

jQuery 语法

jQuery 的语法是为选取 HTML 元素并对这些元素执行操作而量身定制的。

基本语法是:

$(selector).action()
  • $ 符号 - 定义/访问 jQuery
  • (selector) - 用于查找 HTML 元素
  • action() - 要对元素执行的 jQuery 操作

例如:

$(this).hide() - 隐藏当前元素。

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

$(".test").hide() - 隐藏所有 class="test" 的元素。

$("#test").hide() - 隐藏 id="test" 的元素。

您熟悉 CSS 选择器吗?

jQuery 使用 CSS 语法来选取元素。您将在本教程的下一章中学习更多关于选择器语法的内容。

提示:如果您不了解 CSS,可以阅读我们的 CSS 教程

文档就绪事件

您可能已经注意到,我们实例中的所有 jQuery 方法都位于一个文档就绪事件中:

$(document).ready(function(){

  // jQuery 方法写在这里...

});

这是为了防止任何 jQuery 代码在文档加载完成(就绪)之前运行。

等待文档完全加载并准备就绪后再进行操作,这是一种良好的实践。这还允许您将 JavaScript 代码放在文档主体的前面,即 <head> 部分。

以下是一些如果在文档完全加载之前运行方法就可能失败的操作示例:

试图隐藏尚未创建的元素 试图获取尚未加载完成的图片的尺寸

提示:jQuery 团队还为文档就绪事件创建了一个更简短的方法:

$(function(){

  // jQuery 方法写在这里...

});

请使用您偏好的语法。我们认为,在阅读代码时,文档就绪事件的写法更容易理解。