Получить текст рядом с IMG Jquery

Question

Я этот код

$('.arrow img').click(function() { 
 
\t var text = $('.arrow div').contents().text(); 
 
\t alert(text); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="arrow"> 
 
\t <div><img src="images/flechedroite.png" /> Hello the world</div> 
 
\t <div><img src="images/flechedroite.png" /> Give us your feedback</div> 
 
\t <div><img src="images/flechedroite.png" /> We love sharing stuff</div> \t \t \t \t \t \t 
 
</div>

То, что я хочу для каждого изображения, отображение в alert() тексту рядом с ним. Я что-то пробовал, но он не работает.

Благодарим за помощь!

Answer 1

вы можете попробовать .closest() и получить текст для родительского DIV

$('.arrow img').click(function() { 
    var text = $(this).closest('div').text(); 
    alert(text); 
}); 

Answer 2

Вы можете пройти к родительскому сНу элемента с помощью .parent() вместе с .text() найти текст в нем:

$('.arrow img').click(function() { 
    alert($(this).parent().text()); 
}); 

Answer 3

Вы можете использовать как это:

$('.arrow img').click(function() { 
    var text = $(this).parent().contents().filter(function(){ 
     return this.nodeType == 3;//if node type is textNode 
    }); 
    alert(text); 
}); 

Проверьте ссылки: parent, filter и nodeType

Answer 4

Вы можете использовать nextSibling.textContent от JS:

$('.arrow img').click(function() { 
 
    var text = this.nextSibling.textContent; 
 
    $('pre').html(text); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="arrow"> 
 
    <div> 
 
    <img src="images/flechedroite.png" />Hello the world</div> 
 
    <div> 
 
    <img src="images/flechedroite.png" />Give us your feedback</div> 
 
    <div> 
 
    <img src="images/flechedroite.png" />We love sharing stuff</div> 
 
</div> 
 

 
<pre></pre>