`

内容选择器

CSS 
阅读更多
[color=red][size=x-large]内容选择器[/size][/color]
<script type="text/javascript" src="jquery-1.4.3.js"></script>
  <script type="text/javascript">
  $(document).ready(function()
  {
	$("#button1").click(function()
	{
		//匹配包含给定文本的元素.
		//查找所有包含 "test" 的 div 元素
		$("div:contains('test')").css("background","red");
	});

	$("#button2").click(function()
	{
		//匹配所有不包含子元素或者文本的空元素
		//查找所有不包含子元素或者文本的空元素
		$("div:empty").css("background","blue");
	});

	$("#button3").click(function()
	{
		//匹配含有选择器所匹配的元素的元素
		//给所有包含class="mini" 元素的 div 元素添加background
		$("div:has('.mini')").css("background","red");
	});

	$("#button4").click(function()
	{
		//匹配含有子元素或者文本的元素
		//查找所有含有子元素或者文本的 td 元素
		$("div:parent").css("background","yellow");
	});

	$("#button5").click(function()
	{
		//查找隐藏的 tr
		//alert($("div:hidden").length);
		$("div:hidden").show(3000).css("background","orange");
	});

	$("#button6").click(function()
	{
		//查找所有可见的 tr 元素
		//alert($("div:hidden").length);
		$("div:visible").show(3000).css("background","orange");
	});

  });
  </script>
0
9
分享到:
评论

相关推荐

    jQuery选择器全解.

    选择器按功能分为基础选择器、层次选择器、属性选择器、表单选择器、可见性选择器、位置选择器、子元素选择器、内容选择器、属性选择器、表单对象属性选择器以及过滤选择器。每类选择器都有其独特的应用场景,熟悉并...

    jQuery基础选择器练习题

    jQuery中的内容选择器如`:has()`和`:empty`允许我们根据元素包含的内容进行选择,而属性选择器如`$("[attribute=value]")`则让我们能根据HTML属性选取元素。 最后,表单选择器如`:$(":input")`选取所有输入元素,`:...

    jQuery选择器大全(48个代码片段 21幅图演示)

    6. **内容选择器** - `:contains(text)`:选择包含特定文本的元素,如`$("p:contains('Hello')")`。 - `:empty`:选择没有子节点的元素。 - `:has(selector)`:选择包含匹配指定选择器的子元素的元素。 7. **...

    JQuery选择器帮助文档

    3. **文本内容选择器**:选择包含特定文本的元素。 - 示例:`$('table td:contains("Henry")')`会选择包含文本“Henry”的表格单元格,并为其添加`highlight`类。 以上内容涵盖了JQuery 1.3.2版本中的基础选择器和...

    jQuery内容选择器与表单选择器实例分析

    本文将重点介绍jQuery的内容选择器和表单选择器,并通过实例来分析其功能和用法,同时也会提到在使用过程中需要留意的注意事项。 ### 内容选择器 内容选择器是基于DOM元素的文本内容或者子元素来筛选元素的选择器...

    基于jQuery选择器的整理集合

    首先,jQuery选择器可以分为基本选择器、层级选择器、属性选择器、内容选择器以及伪类选择器。基本选择器包括ID选择器(`#id`),类选择器(`.class`),元素选择器(`element`)和通配符选择器(`*`)。这些选择器...

    Jquery选择器总结

    内容选择器基于元素的内容进行选择。 - `:contains(text)`: 选取包含指定文本的元素,例如`$("p:contains('Hello')")`。 - `:empty`: 选取没有子节点(包括文本节点)的元素。 - `:parent`: 选取有子节点的元素。 ...

    jQuery选择器全面总结

    此外,jQuery还提供了其他复杂的选择器,如属性选择器、内容选择器等,它们可以根据元素的属性值、文本内容或后代元素来选取元素。例如,`jQuery("[title]")`会选择所有有`title`属性的元素,而`jQuery(":contains('...

    JQ 内容过滤选择器

    本文将深入探讨"JQ内容过滤选择器"这一关键知识点,它是jQuery选择器体系中的一个重要组成部分,用于从DOM树中筛选出符合特定条件的元素。 一、JQ内容过滤选择器概述 内容过滤选择器允许我们根据元素内部的文本或...

    jquery选择器的几种用法

    9. 内容选择器: `:contains(text)`选择器会选取包含特定文本的元素,`:empty`选择器会选取没有子元素(包括文本节点)的元素。 10. 表单选择器: 对于表单元素,jQuery提供`:input`,`:text`,`:password`,`:...

    Jquery表单-层级-内容-属性-子元素选择器知识点整理

    内容选择器是基于元素的内容来选取元素的,例如检查一个元素是否为空或是否包含其他元素。 - **`$(":empty")`**:选择所有不含有子元素或者文本的元素。 - **`$(":contains('text')")`**:选择包含给定文本的元素。...

    jQuery基础和jQuery选择器教程

    4. **内容选择器**: 根据元素内容选取,如 `:contains()`, `:empty` 和 `:has()`: ```javascript $("p:contains('Hello')"); // 包含特定文本的元素 $("div:empty"); // 内容为空的元素 $("div:has(p)"); // ...

    juqery 学习之三 选择器 简单 内容

    本文将深入探讨jQuery中的几个基础但实用的选择器:`:first`、`:last`、`:not`、`:even`、`:odd` 和 `:eq`。 1. **`:first` 选择器** `:first` 选择器用于选取集合中的第一个元素。在给定的示例中,它用于选取表格...

    JSoup CSS选择器用法大全

    CSS 选择器是用于选取 HTML 或 XML 文档中元素的语法,它们在网页爬虫、页面解析以及动态网页内容的提取中扮演着重要角色。下面将详细介绍 JSoup 支持的各种 CSS 选择器及其用法。 1. **基本选择器**: - `*`: ...

    横向滑动时间选择器

    "横向滑动时间选择器"是一个创新的UI组件,它提供了不同于传统下拉菜单或数字滚轮的时间选取方式,用户可以通过在水平方向上滑动来选择所需的时间。这种设计既直观又具有良好的用户体验,尤其适用于空间有限或者需要...

    简单的选择器Demo

    本Demo主要关注的是CSS选择器的使用,旨在帮助初学者更好地理解和应用选择器。我们将深入探讨CSS选择器的基本类型,以及如何在实际项目中有效利用它们。 一、CSS选择器概述 CSS(层叠样式表)选择器是用于选取HTML...

    jQuery内容过滤选择器与子元素过滤选择器用法实例分析

    内容过滤选择器和子元素过滤选择器是jQuery选择器的两个重要类别,它们允许开发者更精确地定位和操作DOM元素。以下是对这两个类别及其相关选择器的详细解释和实例分析。 一、jQuery内容过滤选择器 1. `:contains...

    layui多选级联选择器

    级联选择器通常包含一个或多个下拉菜单,每个菜单的选择都会影响下一个菜单的内容,以此形成一种逐级递进的关系。在layui的实现中,级联选择器允许用户在一个层级结构中进行多选,提高了用户在大量数据中筛选信息的...

    Android自定义日期选择器源码

    这篇内容将深入探讨如何在Android中创建一个自定义日期选择器,并通过源码分析来增强我们的理解。 首先,我们要明白自定义日期选择器的基本结构。通常,它会包含一个日历视图,让用户可以选择年、月、日,有时还...

Global site tag (gtag.js) - Google Analytics