`
Ydoing
  • 浏览: 105923 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

jQuery层次选择器

 
阅读更多

后代选择器

       //选择 body内的所有div元素.
      $('#btn1').click(function(){
          $('body div').css("background","#bbffaa");
      })

子元素选择器

      //在body内的选择 元素名是div 的子元素.
      $('#btn2').click(function(){
          $('body > div').css("background","#bbffaa");
      })

next同辈选择器

      //选择 所有class为one 的下一个div元素.
      $('#btn3').click(function(){
          $('.one + div').css("background","#bbffaa");
      })

siblings同辈选择器

      //选择 id为two的元素后面的所有div兄弟元素.
      $('#btn4').click(function(){
          $('#two ~ div').css("background","#bbffaa");
      })

参考<锋利的jQuery>

<script type="text/javascript"> $(function () { $('pre.prettyprint code').each(function () { var lines = $(this).text().split('\n').length; var $numbering = $('<ul/>').addClass('pre-numbering').hide(); $(this).addClass('has-numbering').parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($('<li/>').text(i)); }; $numbering.fadeIn(1700); }); }); </script>

版权声明:本文为博主原创文章,未经博主允许不得转载。

分享到:
评论

相关推荐

    jQuery层次选择器选择元素使用介绍

    其主要的层次关系包括后代、父子、相邻、兄弟关系,通过其中基类关系可以方便快捷地定位元素 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器、层次选择器、过滤选择器、表单选择...

    jquery层次选择器的介绍

    jquery层次选择器 jquery层次选择器,包括空格、&gt;、next、+、nextAll、~、siblings、prev()、prevAll()等函数或表达式。 1、空格表示获取所有子孙后代元素 2、 &gt;表示获取一级子元素 3、next函数获取紧接在之后的同辈...

    jQuery层次选择器用法示例

    ### jQuery层次选择器用法 #### 1. 层次选择器概述 jQuery层次选择器是用于选择具有特定层级关系的DOM元素的一组选择器。通过这些选择器可以高效地选取元素的后代、子元素或者具有特定关系的兄弟元素。层次选择器...

    jQuery选择器全解.

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

    JQuery中层次选择器用法实例详解

    接下来将详细介绍JQuery层次选择器的用法,并通过实例进一步阐释。 1. 后代选择器(后代元素) 后代选择器通过空格分隔,能够选择所有指定祖先元素下的后代元素,包括直接子元素以及更深层次的元素。其语法如下: `...

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

    3. **层次选择器** - `child`:`&gt;` 选择子元素,如`$("ul &gt; li")`。 - `descendant`:空格选择后代元素,如`$("div p")`。 - `adjacentSibling`:`+` 选择紧邻的同级元素,如`$("div + p")`。 - `generalSibling...

    jQuery选择器大全

    层次选择器专注于元素间的父子关系和兄弟关系,增强选择的精确度。 1. **直系子元素选择器**:`parent &gt; child`,仅选取指定父元素的直接子元素,例如`$('div &gt; span')`将选取所有直接位于`&lt;div&gt;`标签内的`&lt;span&gt;`...

    jQuery入门之层次选择器实例简析

    本文将详细解析jQuery层次选择器中的"ancestor descendant"和"parent&gt;child"选择器之间的区别,并通过实例来进行说明。 首先,我们来理解"parent&gt;child"选择器。此选择器用于选取所有指定父元素的直接子元素。所谓...

    jquery 层次选择器siblings与nextAll的区别介绍

    在jQuery中,层次选择器是用于选取HTML结构中具有特定关系的元素的关键工具。`siblings()` 和 `nextAll()` 都是层次选择器的一部分,它们虽然相似,但用途略有不同。接下来,我们将深入探讨这两个方法的用法和区别。...

    PPT和案例\jQuery选择器

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

    jQuery选择器基础知识

    层次选择器允许我们根据元素在文档结构中的位置来选取元素。主要有子元素选择器(&gt;`),后代选择器(`&gt;`),相邻兄弟选择器(+)和后续兄弟选择器(~)。 - `$("div &gt; p")` 选择所有直接位于`&lt;div&gt;`内的`&lt;p&gt;`元素。...

    jQuery基本选择器和层次选择器学习使用

    本文将详细介绍jQuery中的基本选择器和层次选择器的使用方法,为那些希望使用jQuery来增强网页功能的开发者提供参考。 首先,基本选择器是最为常用的,它包括ID选择器、类选择器、标签选择器以及通配符选择器。ID...

    jQuery选择器速查表

    层次选择器基于DOM元素之间的层次关系选取特定元素,包括后代、子、相邻和兄弟元素。 - **后代选择器**:通过空格来选取后代元素,例如`$('div span')`选取所有`&lt;div&gt;`元素内的`&lt;span&gt;`元素。 - **子选择器**:通过...

    jquery选择器及jquery表单操作

    #### 层次选择器 - **子元素选择器**:`$("#main &gt; *")`选取ID为`main`的元素的所有直接子元素。 - **相邻兄弟选择器**:`$("label + input")`选取紧接在`&lt;label&gt;`元素后的`&lt;input&gt;`元素。 - **一般兄弟选择器**:`...

    jquery选择器入门详解小案例

    jQuery支持多种CSS选择器,包括基本选择器、层次选择器、属性选择器和类选择器等。这些选择器可以帮助我们更精确地定位到我们需要操作的DOM元素。 1. **基本选择器**: - `$("#id")`:通过ID选择元素,例如`$("#...

    Jquery 选择器整理

    层次选择器允许开发者基于元素之间的关系来选择元素,这包括兄弟元素、后代元素等。这些选择器可以帮助我们更精确地定位到页面中的特定元素。 **实例:** 1. **选择紧接在另一个元素后的兄弟元素(相邻兄弟)** -...

Global site tag (gtag.js) - Google Analytics