Форум

NikZ · #1 (**permalink**) 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 · #2 (**permalink**) 16.07.2013, 15:41

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

???

NikZ · #3 (**permalink**) 16.07.2013, 15:57

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

skrudjmakdak · #4 (**permalink**) 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 · #5 (**permalink**) 16.07.2013, 16:12

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

рони · #6 (**permalink**) 16.07.2013, 16:36

NikZ,

<!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 · #7 (**permalink**) 16.07.2013, 19:55

рони, бесконечный респект тебе

работает!

Форум

Справочник

Discord чат

Курсы javascript