3

Estou tentando modificar uma configuração de uma div irmã, porém estou com dificuldades em encontrar o seletor correto para utilizar, sei que o html trabalha como uma arvore e, geralmente quando preciso selecionar um elemento superior utilizo o parent() e quando se trata de um inferior utilizo o find().

Como seria para selecionar um de mesmo nível?

1
  • 2
    Poste a estrutura que está para ser mais fácil lhe ajudar. Aproveite e faça um tour e entenda melhor como o site funciona.
    – Randrade
    3/03/2016 às 20:00

2 Respostas 2

7

Você pode utilizar siblings como o priprio nome diz "irmãos".

Exemplo:

$('#foo').click(function() {
  var t = $(this).siblings(); // Vai pegar todos os irmãos.
  var t2 = $(this).siblings('#bar'); // Vai pegar apenas o irmão com id correspondente.
  var t3 = $(this).siblings('.bar'); // Vai pegar todos irmãos com as classes correspondente.
  console.log(t);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="foo">FOO</div>
<div id="bar" class="bar">BAR</div>
<div id="bar2" class="bar">BAR2</div>

caso você queria apenas pegar o próximo irmão, você poderá utilizar também o next().

2

Uma outra forma além da resposta do @Gabriel Rodrigues seria utilizar o .parent() e o .find() para selecionar qual deseja.

Veja o exemplo abaixo:

$(document).ready(function(){
  $('#btn').click(function(){
    var irma = $(this).parent().find('#irma').html();
    console.log(irma);
    $('#resultado').html(irma);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div id="irmao">
    eu sou o irmão
  </div>
  <div id="irma">
    eu sou a irmã
  </div>
  <button id="btn">
    Clica aqui
  </button>
  <p id="resultado"></p>
</div>

3
  • Este cenário só funciona se você tem IDs para seus elementos. Num cenários mais comum, onde se procura por tags e/ou classes, dessa forma você pegaria os elementos irmãos + o próprio elemento.
    – FReNeTiC
    3/03/2016 às 20:10
  • @FReNeTiC Concordo com você. Porém eu pedi mais explicações sobre o problema em específico, e como não obtive eu resolvi apenas postar essa outra forma.
    – Randrade
    3/03/2016 às 20:11
  • Lembrando também que o .parent() e o .find() não funcionam apenas com IDs dos elementos, eu que estou usando desta forma para demonstração.
    – Randrade
    3/03/2016 às 20:12

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .