标记包装> My condition (EDIT): 的
的<div class="entry-content">
<h1>This header won't be included</h1>
Write by: Me
<br></br>
On: 01/01/2017
<br></br>
<br></br>
When you quote: "<i>And whoever strives only strives for [the benefit of] himself.</i>"
<br></br>
<br></br>
<i>There</i> is another: "And that <b>there is not for man</b> except that [good] for which he strives, and that his effort is going to be seen, then <a href="#">he will be</a> recompensed for it with the fullest recompense."
<br></br>
<br></br>
<h2>And neither will this one</h2>
I fight for myself.
</div>
My goal (EDIT):
<div class="entry-content">
<h1>This header won't be included</h1>
<p>Write by: Me
<br></br>
On: 01/01/2017</p>
<p>When you quote: "<i>And whoever strives only strives for [the benefit of] himself.</i>"</p>
</p><i>There</i> is another: "And that <b>there is not for man</b> except that [good] for which he strives, and that his effort is going to be seen, then <a hre="#">he will be</a> recompensed for it with the fullest recompense."</p>
<h2>And neither will this one</h2>
<p>I fight for myself.</p>
</div>
I have tried:
$( ".entry-content" )
.contents()
.filter(function() {
return this.nodeType === 3;
})
.wrap( "<p></p>" )
.end()
.filter( "br" )
.remove();
I have also reads many like this before: 的 How can I wrap text nodes 。但他们无法处理<i>
,<b>
,<a>
等
它们看起来像这样:
<div class="entry-content">
<p><h1>This header won't be included</h1></p>
<p>Write by: Me</p>
<p>On: 01/01/2017</p>
<p>When you quote: "</p>
<i>And whoever strives only strives for [the benefit of] himself.</i>
<p>"</p>
<i>There</i>
<p>is another: "And that <b>there is not for man</b> except that [good] for which he strives, and that his effort is going to be seen, then</p>
<a hre="#">he will be</a>
<p>recompensed for it with the fullest recompense."</p>
<p><h2>And neither will this one</h2></p>
<p>I fight for myself.</p>
</div>
答案 0 :(得分:1)
我希望这就是你所需要的:
var rows = $(".entry-content").html().split("<br>");
rows = $.map(rows, function(value) {
return value === "" ? null : value;
});
$(".entry-content").html('<p>' + rows.join("</p>\n<p>") + '</p>');
console.log($(".entry-content").html());
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="entry-content">
When you quote: "<i>And whoever strives only strives for [the benefit of] himself.</i>"
<br><br>
<i>There</i> is another: "And that <b>there is not for man</b> except that [good] for which he strives, and that his effort is going to be seen, then <a hre="#">he will be</a> recompensed for it with the fullest recompense."
<br><br>
I fight for myself.
</div>
&#13;
答案 1 :(得分:1)
这是一个&#34;单线&#34;并不涉及触摸内部HTML文本。它的工作原理是用每个节点包装自己的段落,然后展开每个br
,这样相邻的兄弟和第一子选择器就可以用来找到包装段落应该开始的点。
编辑:为了专门排除包含带有源属性的图像的标题,块引用和锚点,我必须更长时间。一个更高效的实现是在没有jQuery的情况下遍历子节点;如果您需要经常运行,请告诉我,我可以提供替代实施。很难解决jQuery处理文本节点的方式,除了.contents()
之外,它几乎都会丢弃它们。
console.log(
// Begin magic
$('.entry-content')
.contents()
.wrap('<p>')
.filter('br, :header, blockquote, a:has(img[src])')
.unwrap()
.end()
.end()
.children(':first-child, :not(p) + p')
.each(function (i, e) {
$(e).nextUntil(':not(p)').addBack().wrapAll('<p>').contents().unwrap()
})
.end()
.children(':first-child, :not(p) + p')
.each(function (i, e) {
e.firstElementChild || e.textContent.trim() || $(e).remove()
})
.end()
.children('br')
.remove()
// End magic
.end().html())
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="entry-content">
<h1>This header won't be included</h1>
When you quote: "<i>And whoever strives only strives for [the benefit of] himself.</i>"
<br><br>
<i>There</i> is another: "And that <b>there is not for man</b> except that [good] for which he strives, and that his effort is going to be seen, then <a href="#">he will be</a> recompensed for it with the fullest recompense."
<br><br>
<h2>And neither will this one</h2>
I fight for myself.
<blockquote>Keep me</blockquote>
I am special.
<a><img src="http://ignore-me.com"></a>
There <b>is</b> nothing more special than everything
<a><img src="http://ignore-me-too.com"></a>
</div>
&#13;