`

jQuery样式选择器小实例

阅读更多

        jQuery样式选择器可以通过$(".test1.test2.tt3")方式,也可以通过$("[class='test1 test2 tt3']")方式,如下实例所示:

实例1:

<html>
<head>
		<title>jQuery样式选择器</title>
		<script src="jquery-1.7.2.js"></script> 
</head>
<body>
	<span>Hello World</span>
	<div id="tt">China</div>
	<div class="test1 test2 tt3">Hello</div>
  <div class="test1 test2 tt3">Hello2</div>
</body>
	<script>
			$(".test1.test2.tt3").css("color", "red");
	</script>
</html>

运行结果:

 

实例2:

<html>
<head>
		<title>jQuery样式选择器</title>
		<script src="jquery-1.7.2.js"></script> 
</head>
<body>
	<span>Hello World</span>
	<div id="tt">China</div>
	<div class="test1 test2 tt3">Hello</div>
  <div class="test1 test2 tt3">Hello2</div>
</body>
	<script>
			$("[class='test1 test2 tt3']").css("color", "#0F0FFF");
	</script>
</html>

运行结果:

  • 大小: 6.6 KB
  • 大小: 6.8 KB
分享到:
评论

相关推荐

    jquery样式选择器插件源码demo

    《jQuery样式选择器插件源码解析》 在前端开发中,jQuery库因其简洁的API和强大的功能,深受开发者喜爱。其中,样式选择器是jQuery的核心功能之一,它允许我们根据CSS样式规则来选取DOM元素,极大地提高了我们的...

    基于jquery的H5移动端选择器,日期选择器,自定义级联选择器,自定义html选择器

    接下来,可以通过JavaScript代码实例化选择器,并配置所需的参数,如日期格式、级联数据等。最后,将选择器绑定到HTML元素上,即可在页面上看到效果。同时,阅读库的文档将有助于理解其具体用法和API,以便更好地...

    jquery选择器入门详解小案例

    本篇文章将深入探讨jQuery选择器的入门知识,并通过实际的小案例帮助你理解和应用这些选择器。 jQuery选择器是jQuery库的核心部分,它们是用于在HTML文档中查找元素的工具。jQuery支持多种CSS选择器,包括基本选择...

    jquery选择器实例和jar包

    本文将深入探讨jQuery选择器的实例和相关知识,帮助你掌握这一强大的工具。** **1. 元素选择器** 元素选择器基于HTML标签名来选取元素,例如`$("p")`会选择所有的段落元素。通过实例,我们可以看到如何获取并改变...

    jquery日历选择器

    《jQuery日历选择器详解与应用实践》 在网页开发中,日历选择器是一种常见的交互元素,它为用户提供了方便的时间输入方式。本篇文章将深入探讨jQuery日历选择器的实现原理、功能特点以及实际应用,帮助开发者更好地...

    jQuery类选择器用法实例

    在提供的实例代码中,演示了如何使用jQuery类选择器隐藏特定的div元素。当文档加载完成后,通过jQuery的$(document).ready()函数确保DOM完全加载并可以操作,随后为按钮绑定了一个点击事件。当用户点击按钮时,通过...

    jquery获取css中的选择器(实例讲解)

    本文将详细介绍如何使用jQuery获取CSS中的各种选择器,包括基础选择器和层级选择器,并通过实例来说明它们的用法。 首先,我们需要了解一些基础概念。在W3C文档对象模型(DOM)中,元素(Element)是节点(Node)的...

    jquery API文档和入门实例

    1. **选择器**:jQuery的选择器类似于CSS,如`$("#id")`用于选取ID为id的元素,`$(".class")`用于选取所有class为class的元素。更复杂的选择器组合可以实现更精细的元素筛选。 2. **DOM操作**:jQuery提供了便利的...

    Jquery 多种弹出窗口实例

    1. **jQuery 选择器**:选择器是 jQuery 的核心功能之一,用于定位 HTML 元素。通过选择器,我们可以找到需要操作的元素,例如 `$("#id")` 选取 ID 为 id 的元素,`$(".class")` 选取所有 class 为 class 的元素。 ...

    锋利的jQuery+实例

    学习基本的选择器,如ID选择器(#id)、类选择器(.class)和元素选择器(element),以及组合选择器、后代选择器和兄弟选择器等,以高效地选取DOM元素。 2. **DOM操作**:掌握如何添加、删除和修改HTML元素,包括使用...

    jquery实现 左右 双向选择器 挺好用

    在给定的资源中,“jquery实现 左右 双向选择器 挺好用”是一个利用jQuery创建的交互式用户界面组件,用于实现双向选择功能。这种组件常见于需要用户在两个列表之间转移选项的场景,例如在“已选”和“可选”之间...

    jQuery层级选择器实例代码

    jQuery层级选择器是其选择器中的重要组成部分,用于选取特定的DOM元素,它包括了子选择器、后代选择器、相邻兄弟选择器和一般兄弟选择器等。 首先,子选择器“&gt;”用于选取指定元素的直接子元素。例如,代码“$('div...

    jQuery实现级联地区选择

    总的来说,这个实例展示了如何结合使用jQuery、JSP、JavaScript和CSS来实现一个功能完善的级联地区选择器,这在网页开发中非常实用,尤其是在需要用户输入地区信息的场景下。理解并掌握这种实现方式对于提升Web开发...

    jQueryUI官方实例集

    总结起来,《jQueryUI官方实例集》是开发者学习和应用jQueryUI的绝佳资源,它涵盖了选择器、对话框、日期选择器、拖放和排序等多种功能,通过实例化的教学,帮助开发者快速上手,提升网页交互设计的质量和效率。

    jquery 选择器 大全

    jQuery选择器是jQuery库的核心功能之一,它使得开发者能够高效地选取HTML文档中的特定元素,进行操作或应用样式。在jQuery中,选择器分为多种类型,包括基本选择器、层次选择器、过滤器选择器以及内容和属性过滤器。...

    jQuery网页开发实例精解源代码

    源代码的结构可能按照书中的章节进行组织,每个章节对应一个或多个实例,覆盖了DOM操作、事件处理、选择器、动画效果、插件使用以及Ajax通信等多个方面。 在DOM操作方面,读者可以通过实例学习如何使用jQuery选择...

    jQuery后代选择器用法实例

    通过标题与描述,我们得知本文主要是针对jQuery后代选择器的使用方法进行实例分析,特别是通过改变文本颜色的实例来展示如何运用后代选择器来选中特定的HTML元素,并对它们应用样式。 在jQuery中,后代选择器是由...

    jQuery UI弹出层应用实例

    jQuery UI 自带了一套完整的主题系统,允许开发者通过简单的CSS类选择器改变Dialog的颜色、边框、背景等视觉元素。在这个实例中,开发者可能根据需求对默认主题进行了自定义,以适应特定的项目风格。 学习这个实例...

    城市选择器代码 - jquery

    总的来说,这个jQuery城市选择器是Web开发中的一个实用工具,它的设计和实现涵盖了jQuery的基本使用、UI设计、异步通信等多个方面,是学习和理解前端开发技术的好实例。通过深入研究这个代码,开发者不仅可以掌握...

    jquery 时间控件实例

    首先,我们需要了解jQuery的时间控件主要有两种类型:下拉式时间和滑动式时间选择器。下拉式时间控件通常由小时和分钟的下拉菜单组成,用户通过选择菜单中的选项来设定时间。滑动式时间选择器则提供一种更现代的触摸...

Global site tag (gtag.js) - Google Analytics