jQuery что вместо $ (this).parent().children()

#javascript #jquery #parent #children

#javascript #jquery #родительский #дети

Вопрос:

Просто краткий пример:

 <p>
    <span class="example"></span>
    <input type="text" name="e_name" id="e_id />
</p>
<script type="text/javascript">
    $('input').click(function(){
        $(this).parent().children('span').text('Suprise!');
    }
</script>
  

Что я могу использовать вместо parent().children()?

Я думаю, что это немного неэлегантный фрагмент кода. Есть ли какая-либо функция, например: $(this).fun(‘span’).text(‘просто лучше’); ??

Комментарии:

1. Спасибо, что задали очень понятный вопрос, поэтому мне не пришлось нажимать на 3 разных ответа, не зная, что внутри.

Ответ №1:

 $(this).siblings('span').text('Suprise!');
  

Комментарии:

1. Мне определенно нравится .siblings , даже не думал об этой функции, отличный ответ.

2. $(this).siblings() будет игнорировать сам себя, поэтому, если вы хотите настроить таргетинг на дочерние элементы, включая самого себя, parent().children() все еще аккуратно.

Ответ №2:

$(this).siblings('span').text('Surprise!');

Было бы эквивалентно без обхода вверх по DOM, а затем обратно вниз (я имею в виду, он все еще это делает, но, по крайней мере, вы не делаете это вручную).

Ответ №3:

Немного более элегантный .prev()

 $(this).prev('span').text('Surprise!');
  

вы можете прочитать больше об этом здесь: Предыдущее

редактировать: прочитайте разметку в обратном направлении, лучше предыдущее, а не следующее.

Ответ №4:

попробуйте это:

 $(this).prev('span').text('Surprise!');
  

Ответ №5:

 $("span.example",$(this).parent()).text('Suprise!');