Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Нужен хитрый селектор (https://javascript.ru/forum/jquery/39897-nuzhen-khitryjj-selektor.html)

NikZ 16.07.2013 15:32

Нужен хитрый селектор
 
Приветствую! Прошу помощи, уже всю голову сломал:(

Итак, есть 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>


Может, кто в курсе? Мозг уже кипит((

skrudjmakdak 16.07.2013 15:41

так:
$('.text p')

???

NikZ 16.07.2013 15:57

не, в том и суть, что нужно выбрать элементы от заголовка, и до следующего заголовка.

skrudjmakdak 16.07.2013 16:10

ну дак.. а кто запрещает сделать его блоком, т.е. обернуть во что либо.. да в тот же див и задать класс:
<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')
иначе вы будете изобретать велосипед, потратите время только

vadim5june 16.07.2013 16:12

переберите с помощью javascript все $('.text p')
заодно и в div обернете

рони 16.07.2013 16:36

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>

NikZ 16.07.2013 19:55

рони, бесконечный респект тебе:) работает! :)


Часовой пояс GMT +3, время: 10:31.