Нужен хитрый селектор
Приветствую! Прошу помощи, уже всю голову сломал:(
Итак, есть DOM такого вида: <div class="text"> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> </div> Не могу вкурить, как выбрать все <p> от заголовка до заголовка (надо их в div завернуть). Заголовок, впринципе, определяется банальным .text p > u . То есть на выходе селектора надо такого вида куски: <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> Может, кто в курсе? Мозг уже кипит(( |
так:
$('.text p') ??? |
не, в том и суть, что нужно выбрать элементы от заголовка, и до следующего заголовка.
|
ну дак.. а кто запрещает сделать его блоком, т.е. обернуть во что либо.. да в тот же див и задать класс:
<div class="myBlock"> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> <p style="text-align: justify;">куча текста</p> </div> <div class="myBlock"> <p><u>заголовок</u></p> <p style="text-align: justify;">куча текста</p> </div> и делайте выборку по блокам: $('.myBlock') иначе вы будете изобретать велосипед, потратите время только |
переберите с помощью javascript все $('.text p')
заодно и в div обернете |
NikZ,
:write:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<style type="text/css">
div.new{
background-color: #FF0000;
}
</style>
</head>
<body>
<div class="text">
<p><u>заголовок</u></p>
<p style="text-align: justify;">куча текста</p>
<p><u>заголовок</u></p>
<p style="text-align: justify;">куча текста</p>
<p><u>заголовок</u></p>
<p style="text-align: justify;">куча текста</p>
<p><u>заголовок</u></p>
<p style="text-align: justify;">куча текста</p>
<p style="text-align: justify;">куча текста</p>
<p style="text-align: justify;">куча текста</p>
<p style="text-align: justify;">куча текста</p>
<p style="text-align: justify;">куча текста</p>
<p><u>заголовок</u></p>
<p style="text-align: justify;">куча текста</p>
</div>
<script>
$('p:has(u)').each(function(indx, element){
$(element).nextUntil('p:has(u)').wrapAll($('<div/>',{'class':'new'}))
})
</script>
</body>
</html>
|
рони, бесконечный респект тебе:) работает! :)
|
| Часовой пояс GMT +3, время: 18:51. |