普通HTML输出;
<p><h1>Big title</h1>
foo bar foo bar foo bar</p>
我想要这样;
<p>
<h1>
<div class="someCls">Big</div>
<div class="someCls">Title</div>
</h1>
<div class="someCls">foo</div>
<div class="someCls">bar</div>
<div class="someCls">foo</div>
<div class="someCls">bar</div>
<div class="someCls">foo</div>
<div class="someCls">bar</div>
</p>
我无法用jquery&amp; amp;创建它的逻辑。 JavaScript的。 你能救我吗?
答案 0 :(得分:1)
您的标记存在问题,因为p
无法将块元素作为其后代,所以
$('div').contents().contents().addBack().each(function() {
if (this.nodeType == 3) {
$(this).replaceWith($(this.nodeValue.replace(/([^\s]+)/g, '<div class="somecalss">$1</div>')))
}
})
&#13;
.somecalss {
border: 1px solid red;
display: inline-block;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
<h1>Big title</h1>
foo bar foo bar foo bar
</div>
&#13;