获取指定元素的兄弟元素时,能够使用adjacent sibling combinator (+),当中+的两側内容都是selector expression.
假设要获取下例中全部的 h1的直接兄弟元素h2
<div>
<h1>Main title</h1>
<h2>Section title</h2>
<p>Some content...</p>
<h2>Section title</h2>
<p>More content...</p>
</div>
能够直接使用
$('h1 + h2')
// Select ALL h2 elements that are adjacent siblings of H1 elements.

假设要过滤h1的兄弟元素,当然也能够使用
$('h1').siblings('h2,h3,p');
// Select all H2, H3, and P elements that are siblings of H1 elements.

假设要获取当前元素之后的全部兄弟元素,能够使用nextAll()
比如,针对以下的html代码
<ul>
<li>First item</li>
<li class="selected">Second Item</li>
<li>Third item</li>
<li>Fourth item</li>
<li>Fifth item</li>
</ul>

假设要获取第二个条目之后的全部li元素,能够使用例如以下代码

$('li.selected').nextAll('li');
上例也能够使用general sibling combinator (~)来实现
$('li.selected ~ li');

获取直接兄弟元素也能够不使用selector,直接使用next()
var topHeaders = $('h1');
topHeaders.next('h2').css('margin', '0);

jQuery -&gt; 获取兄弟元�的更多相关文章

  1. jquery获取兄弟元素

    按照w3c school的指引,jquery中,要获得一个元素的兄弟,可以用 prev().next()两种方法.顾名思义,prev()获得前一个,next()获得后面一个. 问题是,如果存在前后兄弟 ...

  2. jQuery -&gt; 获取/设置/删除DOM元素的属性

    jQuery的属性操作很easy,以下以一个a元素来说明属性的获取/设置/删除操作 <body> <a>jquery.com</a> </body> 加 ...

  3. jquery Jquery 遍历 获取设置 效果

    speed: slow fast 毫秒 隐藏 显示 $(selector).hide(speed,callback) 隐藏. $(selector).show(speed,callback) 显示 $ ...

  4. jquery如何获取第一个或最后一个子元素

      jquery如何获取第一个或最后一个子元素? 通过children方法,children("input:first-child") $(this).children(" ...

  5. js|jq获取兄弟节点,父节点,子节点

    08.19自我总结 js|jq获取兄弟节点,父节点,子节点 一.js var parent = test.parentNode; // 父节点 var chils = test.childNodes; ...

  6. js和jquery如何获取图片真实的宽度和高度

    按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度   1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...

  7. 获取元素的xpath, 转换xpath为csspath进行jQuery元素获取

    获取元素的xpath, 转换xpath为csspath进行jQuery元素获取 博客分类: 编程心得 jQueryCSSHTML  var $shadow = new Object(); /** 获取 ...

  8. JQuery元素获取

    前言:这是本类别博文JQuery即用即查开篇. 因为查手册太麻烦,而且有时候需要深入命令所在详细页面才能了解此命令的具体作用是什么. 写这几篇文章就是为了,工作遇到问题时,一看这几篇文章就可以查到哪个 ...

  9. 如何解决谷歌浏览器下jquery无法获取图片的尺寸

    代码如下: $(document).ready(function(){ var img_h=$img.height(); var img_w=$img.width(); }) 以上代码在IE和火狐中没 ...

随机推荐

  1. bootstrap字体图标

    bootstrap字体图标 http://v3.bootcss.com/components/ <!DOCTYPE HTML> <html> <head> < ...

  2. Topshelf

    Topshelf允许开发者创建一个简单的控制台程序,将其安装为一个window服务. 这样做的原因很简单:方便调试. 使用命令行工具可以很方面的安装Topshelf创建的服务. server.exe ...

  3. 关于服务器防火墙和discuz论坛的问题

    今天做了一个b2b商城,其中的论坛用的是discuz论坛 .net版本,主页要取出其中三个板块的最新帖子数据,安装好后,帖子数据在dnt_posts1数据表里,其中的tid为外链表dnt_forums ...

  4. Android - Error parsing XML: unbound prefix

    概述 这个问题,虽然看起来不是问题,但是如果不知道的人,还会花点时间,有的人甚至重新安装ADT. 我一开始还以为是排版的问题(Layout),因为初学,弄来弄去,最好还是到网上搜. 其实就不是什么问题 ...

  5. Windows系统创建硬链接文件

    源文件夹:E:\深海 创建新硬链接文件夹:D:\微云同步盘\719179409\4-工作资料\深海   打开命令提示符(管理员) 敲入以下命令:   创建成功后,进入目录 D:\微云同步盘\71917 ...

  6. ajax上传文件进度条

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  7. OREACLE 数据库建表 添加判断表是否存在 不存在则新建

    declare  cnt number; begin   ---查询要创建的表是否存在   select count(*)into cnt from user_tables where table_n ...

  8. linux上ln命令详细说明

    ln是linux中又一个非常重要命令,它的功能是为某一个文件在另外一个位置建立一个同不的链接,这个命令最常用的参数是-s,具体用法是:ln –s 源文件 目标文件. 当我们需要在不同的目录,用到相同的 ...

  9. validate插件深入篇

    1.使用valid()来验证表单是否填写正确: <form id="mainform"> <button id="check">< ...

  10. debain 解决无法显示中文

    首先先配置编码:vim /etc/locale.gen  去掉前面的# en_US.UTF-8 UTF-8 zh_CN GB2312 zh_CN.GBK GBK zh_CN.UTF-8 UTF-8 然 ...