Специальный поиск содержащихся элементов
.contents()
Возвращает все дочерние элементы выбранных элементов, а так же текстовое содержимое. Метод имеет один вариант использования:
.contents():jQuery1.2
Метод не имеет параметров.
В отличие от схожего метода .children(), в этом методе, в результат будут включены блоки текста, лежащие непосредственно внутри выбранных элементов. Например, для страницы, содержащей следующий html-текст
<div class="text"> Текст в начале <p> Текст в параграфе </p> Текст в конце </div>
эти два метода вернут различный результат:
$(".text").children().each(function(){ alert($(this).text()); }); // в результате, на экране появится одно сообщение: "Текст в параграфе" $(".text").contents().each(function(){ alert($(this).text()); }); // в результате, на экране появится три сообщения: "Текст в начале", "Текст в параграфе", "Текст в конце"
В действии
Метод contents хорошо подходит для обработки текста на странице. Например, вот так можно избавиться от тегов принудительного переноса на новую строку <br>, поместив, вместо этого, отдельные части текста в параграфы:
$('.textContainer').contents().filter(function() { return this.nodeType == 3; }) .wrap('<p></p>') .end() .filter('br') .remove();
этот код хорошо обработает, например, такой текст:
<div class="textContainer"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br /><br /> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <br /> <br /> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </div>
в результате, мы получим следующий html:
<div class="container"> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <p> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> <p> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p> </div>