So finden Sie Text ohne HTML-Tag und wrappen Sie es mit einem Element

Question

Ich habe den folgenden HTML-Code. Ich möchte den Text ohne HTML-Tags suchen und ersetzen und ihn in ein Element mit jQuery umbrechen. Gibt es eine Möglichkeit, mein Ziel zu erreichen?

<div class="col span_12_of_12 firstDiv"> 
    <h2>My tasks</h2> 
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr 
    <ul> 
    <li>Lorem ipsum dolor sit</li> 
    <li>Lorem ipsum dolor sit</li> 
    <li>Lorem ipsum dolor sit</li> 
    <li>Lorem ipsum dolor sit</li> 
    </ul> 
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr 
</div> 

Answer 1

Um dies zu erreichen, um die Kind textNodes finden müssen und sie in einem <p> Tag wickeln. Dazu müssen Sie contents() und filter() dann wrap() wie folgt verwenden können:

$('.col').contents().filter(function() { 
 
    return this.nodeType == 3 && this.textContent.trim(); 
 
}).wrap('<p />');

p { border: 1px solid #C00; } /* only used to make the output obvious */

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="col span_12_of_12 firstDiv"> 
 
    <h2>My tasks</h2> 
 
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr 
 
    <ul> 
 
    <li>Lorem ipsum dolor sit</li> 
 
    <li>Lorem ipsum dolor sit</li> 
 
    <li>Lorem ipsum dolor sit</li> 
 
    <li>Lorem ipsum dolor sit</li> 
 
    </ul> 
 
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr 
 
</div>