Оглавление

.parent()

parent([<Селектор>]) — находит контейнер, в который вложен элемент. Получим любые теги, в которые вложены теги <span>, и выведем новый текст вместо их содержимого.

  $("span").parent().html("Это элемент-родитель");


<div><span>Текст</span></div>
<b><span>Текст</span></b>
<b><u>Текст</u></b>


Результат:

<div>Это элемент-родитель</div> 
<b>Это элемент-родитель</b> 
<b><u>Текст</u></b>


Если в качестве необязательного параметра указать селектор, то будут возвращены узлы, которые ему соответствуют. Найдем все теги <div>, в которые вложены теги <span>, и выведем новый текст вместо их содержимого.

  $("span").parent("div").html("Это элемент-родитель");

 

<div><span>Текст</span></div>
<b><span>Текст</span></b>
<b><u>Текст</u></b>

Результат будет выглядеть следующим образом.
<div>Это элемент-родитель</div>
<b><span>Это элемент-родитель</span></b>
<b><u>Текст</u></b>


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


$(":button").click(function() { 
   $(this) // Находим элемент 
   .parent() // Получаем элемент-родитель
   .find("span:first") // Находим первый тег <span>
   .show() // Отображаем его
   .end() // Возвращаемся к элементу-родителю
   .find(":button:first") // Находим внутри него первую кнопку
   .remove(); // Удаляем кнопку
});
 
<div>
<input type="button" value="Показать описание"> Термин l<br>
<span style="display:none">Описание термина l</span>
</div>
<div>
<input type="button" value="Показать описание"> Термин 2<br>
<span style="display:none">Описание термина 2</span>
</div>

Комментарии принадлежат их авторам. Мы не несем ответственности за их содержание.
Отправитель Нити