Wie entferne ich führende und nachfolgende Leerzeichen aus einer bestimmten HTML-Zeichenfolge?

177

Ich habe die folgende HTML-Zeichenfolge. Was wäre Beispielcode in JavaScript, um führende und nachfolgende Leerzeichen aus dieser Zeichenfolge zu entfernen?

<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>
Trimming using JavaScript<br />
<br />
<br />
<br />
all leading and trailing white spaces
<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>
javascript removing-whitespace Sunil
quelle
Überprüfen Sie dies
Musefan
Was ist dein eigentliches Problem? Möchten Sie Leerzeichen entfernen, bevor Sie Knoten in das Dokument einfügen?
Rob W
Ich möchte alle führenden Leerzeichen sowie alle nachfolgenden Leerzeichen entfernen. Ich mag die Trim-Methode in C # sehr, nur dass sie sogar Leerzeichen entfernt.
Sunil
In meinem Beispiel sollte ich nach dem Trimmen endlich Folgendes erhalten: Trimmen mit JavaScript <br /> <br /> <br /> <br /> alle führenden und nachfolgenden Leerzeichen
Sunil
@ Sunil Ich weiß nicht, ob Sie dies jemals gelöst haben, aber Sie könnten eine dieser Lösungen ausprobieren
Chris Baker

Antworten:

244

Siehe die String-Methode trim()- https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String/Trim

var myString = '  bunch    of <br> string data with<p>trailing</p> and leading space   ';
myString = myString.trim();
// or myString = String.trim(myString);

Bearbeiten

Wie in anderen Kommentaren erwähnt, ist es möglich, den Regex-Ansatz zu verwenden. Die trimMethode ist praktisch nur ein Alias ​​für einen regulären Ausdruck:

if(!String.prototype.trim) {  
  String.prototype.trim = function () {  
    return this.replace(/^\s+|\s+$/g,'');  
  };  
}

... dies wird die Methode in den nativen Prototyp für diejenigen Browser einfügen, die noch im flachen Ende des Pools schwimmen.

Chris Baker
quelle
3
Ich würde einen Regex-Weg bevorzugen, da er nicht in allen Browsern unterstützt wird ( Husten Husten IE <9).
PeeHaa
2
Die Trimmmethode schneidet keine Leerzeichen, sondern nur Leerzeichen. Es ist also nicht das, wonach ich suche.
Sunil
8
Ich bin mir nicht sicher, was Ihrer Meinung nach "Leerzeichen" sind, aber beim Trimmen werden Leerzeichen im Allgemeinen (Zeilenumbruch, Leerzeichen, Tabulator usw.) entfernt, nicht nur das Leerzeichen.
bsa
2
@bsa Ich habe verstanden, dass er "Leerraum" im visuellen Sinne bedeutet, wie in "visuell leere Bereiche in den Ergebnissen des Renderns des HTML", und dann fügte er in einem Kommentar oben "außer durch brTags verursachten Zeilenumbrüchen " hinzu.
Chris Baker
2
Warum gibt es kein Häkchen bei einer Antwort mit 170 positiven Stimmen? SO verwirrt mich manchmal.
Tcoulson
63 
var str = "  my awesome string   "
str.trim();

Verwenden Sie für alte Browser Regex

str = str.replace(/^[ ]+|[ ]+$/g,'')
//str = "my awesome string"
Jhankar Mahbub
quelle
2
"[]" ist genau das gleiche wie "". Eine Zeichengruppierung von genau einem Zeichen ist ... nun ... genau ein Zeichen.
Flimzy
2
@Flimzy: Ja, es wäre sinnvoller zu schreiben [\t\n\ ]oder nur \sstattdessen [ ]macht das keinen Sinn.
Erik
11 
string.replace(/^\s+|\s+$/g, "");
Sandeep Manne
quelle
Lesen Sie die Frage, &nbsp;wird anstelle eines gewöhnlichen Leerzeichens verwendet. Darüber hinaus ist das Leerzeichen in einem Tag enthalten.
Rob W
6

Wenn Sie mit einer mehrzeiligen Zeichenfolge wie einer Codedatei arbeiten:

<html>
    <title>test</title>
    <body>
        <h1>test</h1>
    </body>
</html>

Und möchten alle führenden Linien ersetzen, um dieses Ergebnis zu erhalten:

<html>
<title>test</title>
<body>
<h1>test</h1>
</body>
</html>

Sie müssen das multilineFlag zu Ihrer Regex hinzufügen ^und $Zeile für Zeile übereinstimmen:

string.replace(/^\s+|\s+$/gm, '');

Relevantes Zitat aus Dokumenten :

Das "m" -Flag gibt an, dass eine mehrzeilige Eingabezeichenfolge als mehrere Zeilen behandelt werden soll. Wenn beispielsweise "m" verwendet wird, ändern sich "^" und "$" vom Abgleich nur am Anfang oder Ende der gesamten Zeichenfolge zum Anfang oder Ende einer Zeile innerhalb der Zeichenfolge.

Jaime Gómez
quelle
4

Ich weiß, dass dies eine sehr alte Frage ist, aber sie hat immer noch keine akzeptierte Antwort. Ich sehe, dass Sie Folgendes entfernen möchten: HTML-Tags, die "leer" sind, und Leerzeichen, die auf einer HTML-Zeichenfolge basieren.

Ich habe eine Lösung gefunden, die auf Ihrem Kommentar für die gesuchte Ausgabe basiert:

Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces 

var str = "<p>&nbsp;&nbsp;</p><div>&nbsp;</div>Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces<p>&nbsp;&nbsp;</p><div>&nbsp;</div>";
console.log(str.trim().replace(/&nbsp;/g, '').replace(/<[^\/>][^>]*><\/[^>]+>/g, ""));
Erweitern Sie das Snippet

.trim() Entfernt führende und nachfolgende Leerzeichen

.replace(/&nbsp;/g, '') entfernt &nbsp;

.replace(/<[^\/>][^>]*><\/[^>]+>/g, "")); Entfernt leere Tags

Anthony
quelle
3 
var trim = your_string.replace(/^\s+|\s+$/g, '');
SenorAmor
quelle
1
Entfernt es Leerzeichen wie <br /> oder <p> </ p> <div> </ div>? Das Trmming einfacher Leerzeichen ist kein Problem. Es ist die Entfernung von Leerzeichen, nach der ich suche.
Sunil
wird es Leerzeichen entfernen
user2086641
3

01). Wenn Sie nur führende und nachfolgende Leerzeichen entfernen müssen, verwenden Sie Folgendes:

var address = "  No.255 Colombo  "
address.replace(/^[ ]+|[ ]+$/g,'');

Dies gibt die Zeichenfolge "No.255 Colombo" zurück.

02). Wenn Sie den gesamten Leerraum entfernen müssen, verwenden Sie Folgendes:

var address = "  No.255 Colombo  "
address.replace(/\s/g,"");

Dies gibt die Zeichenfolge "No.255Colombo" zurück.

Chamila Maddumage
quelle