Jquery/JS: Получить содержимое сестры родителя

Question

Я думал это будет легко, но реально перепробовал уже все. В общем, по клику на кнопку с классом .button_flower, мне нужно получить html/text дива .catalogue_item_title, то есть текст "Сливки".

let name_buket = "";
$(".button_flower").click(function() {
  name_buket = $(this).parent().prev('.catalogue_item_title').html() // Почему то prev делает обращение к еще одному родителю, а не сестринскому элементу.

  name_buket = $(this).parent().parent().children('.catalogue_item_title') //Получаю объект из одного элемента, но не работает метод html()
  name_buket = $(this).closest('.catalogue_item_title') // Аналогично, получаю объект, но не могу вытянуть html

  $('#name_liked_buket').text(name_buket)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="catalogue_item">
  <div class="catalogue_item_title"><a href="/slivki.html">Сливки</a></div>
  <div class="catalogue_item_image"><img src="img/img1.jpg" alt=""></div>
  <div class="catalogue_item_desc">Букет невесты в нежных тонах из роз, с добавлением гипсофилы и рускуса. Бутоньерка для жениха в подарок.</div>
  <div class="catalogue_item_price">1050</div>
  <div class="catalogue_item_more"><a href="#" id="go" class="button_flower">Заказать</a></div>
</div>


<div id="name_liked_buket">+</div>

Answer 1

по клику на кнопку с классом .button_flower, мне нужно получить html/text дива ".catalogue_item_title", то есть текст "Сливки".

Предложу такой вариант...

let name_buket = "";
$(".button_flower").click(function() {
  name_buket = $(this).parents('.catalogue_item').find('.catalogue_item_title').text()
  console.log(name_buket)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="catalogue_item">
  <div class="catalogue_item_title"><a href="/slivki.html">Сливки</a></div>
  <div class="catalogue_item_image"><img src="img/img1.jpg" alt=""></div>
  <div class="catalogue_item_desc">Букет невесты в нежных тонах из роз, с добавлением гипсофилы и рускуса. Бутоньерка для жениха в подарок.</div>
  <div class="catalogue_item_price">1050</div>
  <div class="catalogue_item_more"><a href="#" id="go" class="button_flower">Заказать</a></div>
</div>


<div id="name_liked_buket">+</div>

Вот вариант через родителей... Вот только нужно правильно понимать с чем ты имеешь дело.

$(".button_flower").click(function() {
  let name_buket = $(this).parent().parent().children('.catalogue_item_title') 
  name_buket = name_buket.text()
  console.log(name_buket)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="catalogue_item">
  <div class="catalogue_item_title"><a href="/slivki.html">Сливки</a></div>
  <div class="catalogue_item_image"><img src="img/img1.jpg" alt=""></div>
  <div class="catalogue_item_desc">Букет невесты в нежных тонах из роз, с добавлением гипсофилы и рускуса. Бутоньерка для жениха в подарок.</div>
  <div class="catalogue_item_price">1050</div>
  <div class="catalogue_item_more"><a href="#" id="go" class="button_flower">Заказать</a></div>
</div>

БЛОГ НА HUSL

Jquery/JS: Получить содержимое сестры родителя

Ответы (1 шт):