jQuery中的类名选择器（.class）用法简单示例

下面是“jQuery中的类名选择器（.class）用法简单示例”的完整攻略。

什么是jQuery中的类名选择器？

在 jQuery 中，类名选择器使用一个点号（.）来表示，类名选择器是一种用于选择 HTML 元素中 class 属性的选择器。

类名选择器的用法

类名选择器使用点号（.）后面跟上 class 名称来选中一个或多个具有相同 class 的元素。

语法：

$('.className')

其中，.className 是指具有某个 class 名称的元素。

示例一

HTML 代码：

<p class="text-red">这是一段红色的文字。</p>
<p class="text-green">这是一段绿色的文字。</p>
<p class="text-blue">这是一段蓝色的文字。</p>

如果需要选中所有 class 名称为 text-red 的元素，可以使用类名选择器 .text-red：

$('.text-red')

这样，就可以选中第一个 <p> 元素，并可以对其进行 CSS 样式的修改。

示例二

HTML 代码：

<ul class="nav">
  <li>首页</li>
  <li>新闻</li>
  <li>产品</li>
  <li>关于我们</li>
  <li>联系我们</li>
</ul>

如果需要选中所有 class 名称为 nav 的元素下的所有 <li> 元素，可以使用类名选择器 .nav li：

$('.nav li')

这样，就可以选中所有 <li> 元素，并可以对它们进行 CSS 样式的修改。

结语

以上就是关于“jQuery中的类名选择器（.class）用法简单示例”完整攻略的介绍。类名选择器是 jQuery 中一种比较常见的选择器，也是比较实用的一种选择器。熟练掌握类名选择器的使用，可以帮助开发者快速地定位并修改网页中的元素样式。