Entsprechen Teile des Textes innerhalb des Tags

Question

Ich bin im clientseitigen Kontext. Ich habe diesen HTML:

<p>Text text \n other text </p> 

ich nur \ n Element in Absatz anpassen möchten, und ersetzen nur das mit „br“ -Tag.

Ich möchte dies nur innerhalb Tag "p" und für alle übereinstimmen.

Ich sollte Regex in Javascript verwenden.

Danke und Entschuldigung für mein schlechtes Englisch.

Answer 1

Verwenden Sie html() Methode mit Callback und innerhalb Callback ersetzen Text mit String#replace Methode.

$('p').html(function(i, htm) { 
 
    return htm.replace(/\\n/g, '<br>'); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p>Text text \n other text</p>

UPDATE 1: Wenn es sich um eine Zeichenfolge dann String#replace Methode verwenden ist.

console.log(
 
    '<p>Text text \n other text</p>'.replace(/\n/g, '<br>') 
 
)

---

UPDATE 2: Wenn die Zeichenfolge enthält anderes Tag-Element, und Sie wollen genauso wie den p Tag dann etwas zu aktualisieren.

var str = '<p>Text text \n other text</p>'; 
 

 
console.log(
 
    // create a temporary div eleemnt 
 
    $('<div>', { 
 
    // set html content from string 
 
    html: str 
 
    }) 
 
    // get all p tags 
 
    .find('p') 
 
    // iterate and replace \n 
 
    .html(function(i, htm) { 
 
    // replace \n with br tag 
 
    return htm.replace(/\n/g, '<br>') 
 
    }) 
 
    // back to the temp div 
 
    .end() 
 
    // get it's updated html content 
 
    .html() 
 
)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

---

UPDATE 3: Mit reinem JavaScript durch ein temporäres DOM-Element zu erzeugen.

var str = '<p>Text text \n other text</p>'; 
 
// create a temporary div element 
 
var div = document.createElement('div'); 
 
// set html content form string 
 
div.innerHTML = str; 
 
// get all p tags and convert into Array using Array.from 
 
// for older browser use [].sclice.call instead 
 
Array.from(div.getElementsByTagName('p')) 
 
    // iterate over p tags 
 
    .forEach(function(el) { 
 
    // update the html content 
 
    el.innerHTML = el.innerHTML.replace(/\n/g, '<br>') 
 
    }); 
 
// get updated html content 
 
console.log(div.innerHTML);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

Sie können eine for Schleife mit getElementsByTagName verwenden:

for(i = 0; i < window.document.getElementsByTagName("p").length; i++){ 
    window.document.getElementsByTagName("p")[i].innerHTML = window.document.getElementsByTagName("p")[i].innerHTML.replace(/\\n/g, "<br/>"); 
} 

Wenn diese in einem String und nicht innerhalb des HTML, können Sie es zu einem <div> Element hinzufügen, während handhabung es so:

var myString = "<p>Text text \n other text </p>"; 
var div = document.createElement("div"); 
div.innerHTML = myString; 
for(i = 0; i < div.getElementsByTagName("p").length; i++){ 
    div.getElementsByTagName("p")[i].innerHTML = div.getElementsByTagName("p")[i].innerHTML.replace(/\\n/g, "<br/>"); 
} 
myString = div.innerHTML;