Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Применение библиотек > jquery мультивраппинг нод


Автор: Frozen_Coyote 30.10.2015, 15:43
Привет

есть к примеру текст

Код

<div id="container">
<p>Абзац 1</p>
Строка-потеряшка 1<a href="link">Ссылка</a> Строка-потеряшка 2
<p>Абзац 2</p>
<p>Абзац 3</p>
Строка-потеряшка 3<img /> <span>123</span>
<p>Абзац 4</p>
<p>Абзац 5</p>
</div>


как мне найти застрявшие между параграфами голые строки и теги и обернуть их в <p>? Регулярками можно, но не хочу, интересует решение, так сказать  пуреджэкуэри. Забавность в том что $("#container").find("*") ловит только теги, как то надо ползти со стороны $("#container").contents().filter, но что то не смекну как. + главная фишечка нужна: разумеется новый параграф должен оборачивать всех несчестных страдальцев, застрявших между параграфами ОПТОМ а не каждую ноду по отдельность, т.е. 

Код

<div id="container">
<p>Абзац 1</p>
<p>Строка-потеряшка 1<a href="link">Ссылка</a> Строка-потеряшка 2</p>
<p>Абзац 2</p>
<p>Абзац 3</p>
<p>Строка-потеряшка 3<img /> <span>123</span></p>
<p>Абзац 4</p>
<p>Абзац 5</p>
</div>



спасибо

Автор: Padonak 31.10.2015, 00:10
Код

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>XZ</title>
<style>
p{
padding:20px;
background-color:#f8f8ff;
border:1px solid #ccc;
border-radius:5px;
}
p.new{
background-color:Lightsteelblue;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
/* http://ru.vingrad.com/jquery-multivrapping-nod-id56336651ae2015c6738b4567 */

/* оказывается, jQuery, игнорит текстовые ноды. нашел в интернете как это победить.
так что, как говорится, пользуйтесь поиском и вам воздастся :) */
function isTextNode(){
return(this.nodeType === 3);
}

$(document).ready(function(){
$( "#container").contents().filter(isTextNode).wrap('<span></span>');
$('#container p').each(function(){
if($(this).next().is(':not(p)')){
$(this).nextUntil('p').wrapAll('<p class="new"></p>');
}
});
/* толком не понял откуда берутся пустые параграфы со спанами внутри,
поэтому просто их тупо трем. ищите откуда у них ноги растут самостоятельно,
если надо */
$('p.new').each(function(){
if($(this).text().length < 2){$(this).remove();}
});
});
</script>
</head>
<body>
<center>
<div id="container">
<p>Абзац 1</p>
Строка-потеряшка 1<a href="link">Ссылка</a> Строка-потеряшка 2
<p>Абзац 2</p>
<p>Абзац 3</p>
Строка-потеряшка 3<img src="http://ru.vingrad.com/images/mann_150x150.png" /> <span>123</span>
<p>Абзац 4</p>
<p>Абзац 5</p>
</div>
</center>
</body>
</html>


Этот ответ добавлен с нового Винграда - http://ru.vingrad.com/jquery-multivrapping-nod-id56336651ae2015c6738b4567#findElement_E7045_5633dcb5ae20151c6c887097_0

Автор: Padonak 2.11.2015, 19:38
Я смотрю, тут как-то не особо принято отписываться на предмет подошло/не подощло и т.п. В итоге не совсем понятно: правильно ты сделал, что просра потратил время на чужие проблемы или лучше было кино посмотреть?

Этот ответ добавлен с нового Винграда - http://ru.vingrad.com/jquery-multivrapping-nod-id56336651ae2015c6738b4567#findElement_E7045_56379185ae20157235f4e407_0

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)