`

jquery 后代选择器 与 过滤选择器 区别

阅读更多
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
	<script type="text/javascript">
		$(function(){
		  //注意区分类似这样的选择器
		  //虽然一个空格,却截然不同的效果.
		   var $t_a = $('.test :hidden'); // 后代选择器
		   var $t_b = $('.test:hidden');  //过滤选择器
		   var len_a = $t_a.length;
		   var len_b = $t_b.length;
		   alert("$('.test :hidden') = "+len_a);  //输出 4 
		   $t_a.each(function(){
				alert($(this).text());
		   });
		   alert("$('.test:hidden') = "+len_b);  //输出 3
		   $t_b.each(function(){
				alert($(this).text());
		   });
		})
	</script>
</head>
<body>
	<div class="test">
	   <div style="display:none;">aa</div>
	   <div style="display:none;">bb</div>
	   <div style="display:none;">cc</div>
	   <div class="test" style="display:none;">dd</div>
	</div>
	<div class="test" style="display:none;">ee</div>
	<div class="test" style="display:none;">ff</div>
</body>
 
分享到:
评论

相关推荐

    jQuery选择器-过滤器总结

    #### 后代选择器 1. **selector1 selector2**: 选取selector1内的selector2元素。 2. **selector1 &gt; selector2**: 选取selector1内直接子元素中的selector2元素。 3. **selector1 + next**: 选取紧接在selector1后...

    jQuery基础选择器练习题

    1. **后代选择器**: 使用空格分隔两个选择器,如`$("div p")`选取`&lt;div&gt;`内的所有`&lt;p&gt;`元素。 2. **子元素选择器**: 使用`&gt;`符号,如`$("div &gt; p")`选取`&lt;div&gt;`的直接子元素`&lt;p&gt;`。 3. **相邻兄弟选择器**: 使用`+`...

    jQuery选择器全解.

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

    JQuery选择器测试 离线版

    在jQuery中,选择器分为多种类型,包括基础选择器、类别选择器、ID选择器、属性选择器、后代选择器、子元素选择器、相邻兄弟选择器和通用选择器等。 1. **基础选择器**:主要包括`$()`,用于选取一个或多个DOM元素...

    PPT和案例\jQuery选择器

    层次选择器用于根据元素之间的关系进行选择,包括子选择器(`&gt;`)、后代选择器(` `)、相邻兄弟选择器(`+`)和后续兄弟选择器(`~`)。例如: - `$("#parent &gt; #child")` 选择ID为`parent`的元素内的直接子元素`...

    jquery基本选择器

    4. **后代选择器 ( )** 使用空格来选取某个元素的后代元素。例如,`$("div p")`会选择所有在`div`元素内的`p`元素。 5. **子元素选择器 (&gt;)** 使用大于号`&gt;`来选取某个元素的直接子元素。例如,`$("ul &gt; li")`...

    jquery双向选择器代码

    "jquery双向选择器代码"这个主题涉及的是jQuery中一种特殊的选择器机制,它允许我们从DOM(文档对象模型)中选取元素,同时还能根据某个元素选取其关联的元素,实现数据的双向绑定或者元素间的交互效果。这种功能在...

    jQuery选择器速查表

    - **后代选择器**:通过空格来选取后代元素,例如`$('div span')`选取所有`&lt;div&gt;`元素内的`&lt;span&gt;`元素。 - **子选择器**:通过`&gt;`来选取直接子元素,例如`$('div &gt; span')`选取`&lt;div&gt;`元素的直接子元素`&lt;span&gt;`。 -...

    03-jQuery选择器和过滤器(20220302).ppt

    后代选择器`$("ancestor descendant")`选取所有祖先元素的后代;后相邻选择器`$("prev+next")`选取紧跟在前一个元素后面的元素;兄弟选择器`$("prev~siblings")`选取所有与前一个元素有相同父元素的兄弟元素。 接...

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

    **jQuery选择器大全** jQuery库以其易用性和强大的选择器功能而闻名,使得JavaScript开发者能够更轻松地操作DOM(文档对象模型)。以下是一份详细的知识点概述,涵盖了jQuery中的主要选择器及其应用。 1. **基本...

    jQuery后代选择器用法实例

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

    Jquery 选择器整理

    ### Jquery 选择器整理 #### 基本选择器 **功能描述:** 基本选择器是jQuery中最常用的类型之一,它们提供了简单的DOM元素选择方式。通过这些选择器,开发者可以快速定位到页面中的特定元素。 **代码示例与...

    jQuery选择器基础知识

    主要有子元素选择器(&gt;`),后代选择器(`&gt;`),相邻兄弟选择器(+)和后续兄弟选择器(~)。 - `$("div &gt; p")` 选择所有直接位于`&lt;div&gt;`内的`&lt;p&gt;`元素。 - `$(".parent .child")` 选择所有位于拥有"class=parent...

    jquery选择器及jquery表单操作

    - **后代选择器**:`$("tr:first")`选取所有`&lt;tr&gt;`元素中的第一个元素。 - **子代选择器**:`$("div span:first-child")`选取每个`&lt;div&gt;`下的第一个`&lt;span&gt;`子元素。 #### 属性选择器 - `$("div[id]")`选取所有...

    jQuery选择器的一个Bug

    比如,当选择器包含特定的属性选择器、后代选择器或伪类选择器时,可能遇到性能问题,甚至可能导致错误的结果集。例如,如果一个选择器试图匹配动态创建的元素,或者在具有特定DOM结构的页面上运行,问题可能就会...

    jquery语法与选择器介绍 带有案例

    2. **组合选择器**:`$('element1, element2')`(并集选择器)、`$('element1 element2')`(后代选择器)、`$('element1 &gt; element2')`(子元素选择器)。 3. **属性选择器**:`$('[attribute=value]')`(按属性选择...

    jquery 元素选择器使用方法技巧

    - **后代选择器**:`$('parent &gt; child')` 选取 `parent` 元素的所有直接子元素 `child`。 - **子元素选择器**:`$('parent &gt; .child')` 选取 `parent` 下所有类名为 `.child` 的子元素。 - **相邻同胞选择器**:...

    jquery 选择器 大全

    在jQuery中,选择器分为多种类型,包括基本选择器、层次选择器、过滤器选择器以及内容和属性过滤器。下面我们将详细探讨这些选择器的用法和实例。 1. **基本选择器**: - `#id`:通过ID选择器选取具有特定ID的元素...

    Jquery实验室的选择器工具

    这些包括子选择器(`&gt;`),后代选择器(` `),相邻兄弟选择器(`+`)和后续兄弟选择器(`~`)。例如,`$("div &gt; p")`选取所有直接位于`&lt;div&gt;`元素内的`&lt;p&gt;`元素,而`$(".parent .child")`选取所有在类为`parent`的...

    jquery选择器学习文档

    选择器是 JQuery 的核心功能之一,它们允许开发者高效地选取页面上的特定元素进行操作。下面将详细介绍给定文件中提及的各类 JQuery 选择器。 1. **基本选择器** - `#id`:通过ID匹配唯一元素,例如`$("#myId")`会...

Global site tag (gtag.js) - Google Analytics