Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.07.2013, 15:32
Новичок на форуме
Отправить личное сообщение для NikZ Посмотреть профиль Найти все сообщения от NikZ
 
Регистрация: 16.07.2013
Сообщений: 3

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

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


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

Последний раз редактировалось NikZ, 16.07.2013 в 15:58.
Ответить с цитированием
  #2 (permalink)  
Старый 16.07.2013, 15:41
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

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

???
Ответить с цитированием
  #3 (permalink)  
Старый 16.07.2013, 15:57
Новичок на форуме
Отправить личное сообщение для NikZ Посмотреть профиль Найти все сообщения от NikZ
 
Регистрация: 16.07.2013
Сообщений: 3

не, в том и суть, что нужно выбрать элементы от заголовка, и до следующего заголовка.
Ответить с цитированием
  #4 (permalink)  
Старый 16.07.2013, 16:10
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

ну дак.. а кто запрещает сделать его блоком, т.е. обернуть во что либо.. да в тот же див и задать класс:
<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')
иначе вы будете изобретать велосипед, потратите время только
Ответить с цитированием
  #5 (permalink)  
Старый 16.07.2013, 16:12
Аватар для vadim5june
Студент
Отправить личное сообщение для vadim5june Посмотреть профиль Найти все сообщения от vadim5june
 
Регистрация: 30.04.2012
Сообщений: 1,113

переберите с помощью javascript все $('.text p')
заодно и в div обернете
Ответить с цитированием
  #6 (permalink)  
Старый 16.07.2013, 16:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

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>

Последний раз редактировалось рони, 16.07.2013 в 16:52. Причина: добавил обёртку дивом
Ответить с цитированием
  #7 (permalink)  
Старый 16.07.2013, 19:55
Новичок на форуме
Отправить личное сообщение для NikZ Посмотреть профиль Найти все сообщения от NikZ
 
Регистрация: 16.07.2013
Сообщений: 3

рони, бесконечный респект тебе работает!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
хитрый селектор torsar (X)HTML/CSS 1 17.03.2013 09:42
Очень нужен скрипт для лёгкого интернет магазина samael Общие вопросы Javascript 3 26.06.2012 10:35
Динамический селектор raindew Элементы интерфейса 3 20.11.2011 18:37
Предыдущий селектор KupueIIIKo jQuery 1 05.10.2011 01:27
Подстановка переменной в селектор cobria2 jQuery 1 26.06.2011 18:20