#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!');