jQuery 语法
jQuery用于从HTML文档中选择任何HTML元素,然后对选择的元素执行任何操作。要选择HTML元素,可以使用jQuery选择器,在下一章节中我们将详细研究这些选择器。现在让我们看一下基本的 jQuery语法 来查找、选择或查询一个元素,然后对选择的元素执行操作。
文档就绪事件
在我们深入研究 jQuery语法 之前,让我们先了解一下什么是 文档就绪事件 。实际上,在执行任何jQuery语句之前我们希望等待文档完全加载。这是因为jQuery工作在DOM上,如果在执行jQuery语句之前完整的DOM不可用,那么我们将无法得到期望的结果。
下面是文档就绪事件的基本语法:
或者您还可以使用以下语法来触发文档就绪事件:
您应始终将 文档就绪事件 块放在 < script>...</script>
标签内,而且您可以将此脚本标签放在 < head>...</head>
标签内或者在关闭 < body>标签前的页面底部放置。
您可以使用其中两种语法将您的jQuery代码放在此块内,在完整的DOM下载并准备好解析之后,它才会执行。
jQuery语法
以下是选择HTML元素,然后在所选元素上执行某些操作的基本语法:
任何jQuery语句都以一个美元符号 $ 开始,然后我们将一个选择器放在括号 () 内。这个语法 $(选择器) 足以返回选定的HTML元素,但如果您必须对选定的元素执行任何操作,则需要 action() 部分。
工厂函数 $()
是 jQuery() 函数的同义词。因此,如果您使用了其他JavaScript库,其中美元符号$与其他内容冲突,则可以用jQuery名称替换美元符号 $
,并且可以使用函数 jQuery() 代替 $()
。
示例
以下是几个示例,用于说明基本的jQuery语法。下面的示例将从HTML文档中选择所有的 < p>
元素,并将隐藏这些元素。
让我们使用 jQuery() 方法来重新编写上面的示例,而不是使用 $() 方法:
以下是更改所有 <h1>
元素颜色为红色的jQuery语法。
类似的方法,您可以更改所有类为“red”的元素的颜色。
到目前为止,我们给您展示了一些非常基本的jQuery语法示例,以便让您清楚地了解jQuery在HTML文档上的工作方式。您可以修改上面方框中给出的代码,然后尝试运行这些程序,以实时观看它们的效果。