Trimmen Sie Leerzeichen vom Anfang und Ende der Zeichenfolge

152

Ich versuche einen Weg zu finden, um Leerzeichen vom Anfang und Ende der Titelzeichenfolge zu kürzen. Ich habe das benutzt, aber es scheint nicht zu funktionieren:

title = title.replace(/(^[\s]+|[\s]+$)/g, '');

Irgendwelche Ideen?

James Jeffery
quelle
1
var s = '1'; s = s.replace (/ ^ \ s + | \ s + $ / g, ''); alert ('-' + s + '-'); // es funktioniert so, du brauchst keine Parens oder eckigen Klammern.
ekerner
2
Javascript .trimwurde jetzt eingebaut, daher ist dies die Antwort für moderne Browser: stackoverflow.com/a/3000900/29182
Ziggy
function trim11 (str) { str = str.replace(/^\s+/, ''); for (var i = str.length - 1; i >= 0; i--) { if (/\S/.test(str.charAt(i))) { str = str.substring(0, i + 1); break; } } return str; }
Badri Gs

Antworten:

216

Hinweis: Ab 2015 alle gängigen Browser (einschließlich IE> = 9) String.prototype.trim () . Dies bedeutet, dass für die meisten Anwendungsfälle das einfache Tun str.trim()der beste Weg ist, um das zu erreichen, was die Frage stellt.


Steven Levithan analysierte viele verschiedene Implementierungen von trimJavascript in Bezug auf die Leistung.

Seine Empfehlung lautet:

function trim1 (str) {
    return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}

für "Allzweckimplementierung, die schnell browserübergreifend ist" und

function trim11 (str) {
    str = str.replace(/^\s+/, '');
    for (var i = str.length - 1; i >= 0; i--) {
        if (/\S/.test(str.charAt(i))) {
            str = str.substring(0, i + 1);
            break;
        }
    }
    return str;
}

"Wenn Sie lange Zeichenfolgen in allen Browsern außergewöhnlich schnell verarbeiten möchten".

Verweise

Polygenschmierstoffe
quelle
21
Die neuen Versionen Safari (5), Chrome (5), Firefox (3.6) und Opera (10.5) unterstützen alle eine native String-Trimmmethode. In diesem Fall würde ich String.prototype eine Methode zuweisen, falls sie nicht vorhanden ist, und keine neue globale Funktion.
kennebec
14
String.prototype.trim = String.prototype.trim || function trim() { return this.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); };
Kojiro
3
Ich bezweifle, dass dieser Test nach den jüngsten Verbesserungen der Javascript-Leistung immer noch relevant oder zuverlässig ist, wie zum Zeitpunkt dieser Antwort.
Eduardo
2
Warum verwenden Sie doppelte weiße Zeichen? aka warum diese Regex /^\s\s*/und nicht diese/^\s*/
aemonge
Warum trim1und trim11?
Marty Cortez
68

Wenn die Verwendung von jQuery eine Option ist:

/**
 * Trim the site input[type=text] fields globally by removing any whitespace from the
 * beginning and end of a string on input .blur()
 */
$('input[type=text]').blur(function(){
    $(this).val($.trim($(this).val()));
});

oder einfach:

$.trim(string);
Stein
quelle
48

Wie @ChaosPandion erwähnt, das String.prototype.trimhat Methode in die eingeführt ECMAScript 5th Edition Specification, einige Implementierungen diese Methode bereits enthalten, so dass der beste Weg , um die native Implementierung zu erkennen ist und erklärt es nur , wenn es nicht verfügbar ist:

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

Dann können Sie einfach:

title = title.trim();
CMS
quelle
1
Ich bin immer ein wenig amüsiert über dieses Mem, zu prüfen, ob die Eigenschaft eine Funktion ist. Wenn es keine Funktion ist, ist das richtige Verhalten wirklich, um es zu überschreiben? Vielleicht sollten Sie in diesem Fall einen Fehler auslösen.
Kojiro
1
@kojiro, na ja, vielleicht wäre es gut, einen Fehler zu werfen, aber ich sehe das so: Ich versuche, eine spezifikationskonforme Unterlegscheibe zu erstellen , und wenn dies String.prototype.trimkeine Funktion ist, ist dies nicht die String.prototype.trimin der ECMAScript 5th Edition beschriebene Methode Spezifikation, die Spezifikation garantiert, dass trimes sich in ES5-Umgebungen um ein Funktionsobjekt handelt.
CMS
7
throw { name: "UnlikelyPolyfillException", message: "Did someone really write a property on the String prototype named 'trim' that isn't a ECMA 5 compatible shim? Come on now, that's crazy." }
Kojiro
34

Ich weiß, dass dies ein alter Beitrag ist, dachte aber nur, ich würde unsere Lösung teilen. Auf der Suche nach kürzesten Code (nicht jeder nur lieben Terse regex), könnte man stattdessen verwenden:

title = title.replace(/(^\s+|\s+$)/g, '');

Übrigens: Ich habe denselben Test über den oben angegebenen Blog durchgeführt. Blog.stevenlevithan.com - Schnelleres JavaScript-Trimmen und dieses Muster schlagen alle anderen HÄNDE nieder!

Mit IE8 wurde Test als Test13 hinzugefügt. Die Ergebnisse waren:

Ursprüngliche Länge: 226002
trim1: 110 ms (Länge: 225994)
trim2: 79 ms (Länge: 225994)
trim3: 172 ms (Länge: 225994)
trim4: 203 ms (Länge: 225994)
trim5: 172 ms (Länge: 225994)
trim6: 312 ms (Länge: 225994)
trim7: 203 ms (Länge: 225994)
trim8: 47 ms (Länge: 225994) trim9: 453 ms (Länge: 225994)
trim10: 15 ms (Länge: 225994)
trim11:
16 ms (Länge: 225994)
trim12: 31 ms (Länge: 225994)
trim13: 0ms (Länge: 226002)

user590028
quelle
11

ECMAScript 5 unterstützt trimund dies wurde in Firefox implementiert.

trimmen - MDC

ChaosPandion
quelle
11

Hier sollte dies alles tun, was Sie brauchen

function doSomething(input) {
    return input
              .replace(/^\s\s*/, '')     // Remove Preceding white space
              .replace(/\s\s*$/, '')     // Remove Trailing white space
              .replace(/([\s]+)/g, '-'); // Replace remaining white space with dashes
}

alert(doSomething("  something with  some       whitespace   "));
CaffGeek
quelle
\ s \ s * scheint überflüssig, da es \ s + gibt, aber es ist ein bisschen schneller
CaffGeek
4

Hier sind einige Methoden, die ich in der Vergangenheit verwendet habe, um Zeichenfolgen in js zu trimmen:

String.prototype.ltrim = function( chars ) {
    chars = chars || "\\s*";
    return this.replace( new RegExp("^[" + chars + "]+", "g"), "" );
}

String.prototype.rtrim = function( chars ) {
    chars = chars || "\\s*";
    return this.replace( new RegExp("[" + chars + "]+$", "g"), "" );
}
String.prototype.trim = function( chars ) {
    return this.rtrim(chars).ltrim(chars);
}
Azatoth
quelle
Die RegExp ^[\s*]+Spiele *am Anfang des Strings, so dass Ihre Funktion trimmt "*** Foo"zu "Foo".
Ferdinand Beyer
wahrscheinlich :) frage mich, warum sich niemand beschwert hat ... Es ist lange her, dass ich diesen Code geschrieben habe und er wird in en.wikipedia.org/wiki/Wikipedia:Twinkle verwendet . Jetzt, wo Sie darauf hinweisen, ist es offensichtlich.
Azatoth
4

Hier ist mein aktueller Code, die 2. Zeile funktioniert, wenn ich die 3. Zeile kommentiere, aber nicht, wenn ich sie so lasse, wie sie ist.

var page_title = $(this).val().replace(/[^a-zA-Z0-9\s]/g, '');
page_title = page_title.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
page_title = page_title.replace(/([\s]+)/g, '-');
James Jeffery
quelle
Entfernen Sie die zweite und dritte Zeile und verwenden Sie den Code von Polygenelubricants, page_title = trim1 (page_title);
Ameise
Letztendlich versuchen Sie also, diese Zeichenfolge so zu bereinigen, dass sie abgeschnitten, alphanumerisch und mit Bindestrichen anstelle von Leerzeichen als Trennzeichen versehen wird.
CaffGeek
@chad ja. So erstellen Sie Slug-URLs im laufenden Betrieb, damit Benutzer sehen können, wie ihre URL aussehen wird. Ähnlich wie WordPress es beim Erstellen neuer Blog-Beiträge tut.
James Jeffery
2

jQuery.trim ("Hallo, wie geht es dir?");

:) :)

Geist
quelle
2
Sieht so aus, als würden Sie einen Witz machen, aber denken Sie daran, dass die Leute, die diesen Kommentar lesen, möglicherweise versucht sind, Ihre Lösung zu verwenden und weiterzumachen.
Commadelimited
$ .trim ("blabh bla bla"); gibt korrekt "blabh blah blah" zurück
RAY
2

Wenn das DOM vollständig geladen ist, können Sie dies allen Textfeldern hinzufügen. Ich hatte noch nie eine Situation, in der ich führenden oder nachfolgenden Platz einreichen musste, also hat es für mich funktioniert, die ganze Zeit weltweit zu arbeiten ...

$(function() { $('input[type=text]').on('blur', function(){
    $(this).val($.trim($(this).val()));
  });
});
Mark Swardstrom
quelle
erfordert jQuery. Eine andere Frage (ich habe sie nicht getestet): blurTritt sie tatsächlich vor dem Senden auf, wenn ich mich in einem Feld befinde und die <kbd> Eingabe </ kbd> drücke, um ein Formular zu senden?
Amenthes
2

Dies wird von JavaScript Architect / Guru Douglas Crockford vorgeschlagen.

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

Hinweis: Sie müssen "Methode" für Function.prototype definieren.

Alternative

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

title.trim();    // returns trimmed title

Überwachung

In neueren Browsern ist die Trimmmethode standardmäßig enthalten. Sie müssen es also nicht explizit hinzufügen.

Die gängigen Browser Chrome, Firefox, Safari usw. unterstützen die Trimmmethode . Eingecheckt in Chrome 55.0.2883.95 (64-Bit), Firefox 51.0.1 (64-Bit), Safari 10.0 (12602.1.50.0.10).

mythischer Kodierer
quelle
1
var word = " testWord ";   //add here word or space and test

var x = $.trim(word);

if(x.length > 0)
    alert('word');
else
    alert('spaces');
Jitendra
quelle
0

ein rekursiver Versuch dafür

function t(k){ 
    if (k[0]==' ') {
        return t(k.substr(1,k.length));
    } else if (k[k.length-1]==' ') {
        return t(k.substr(0,k.length-1));
    } else {
        return k;
    }
}

so anrufen:

t("      mehmet       "); //=>"mehmet"

Wenn Sie bestimmte Zeichen filtern möchten, können Sie im Grunde eine Listenzeichenfolge definieren:

function t(k){
    var l="\r\n\t "; //you can add more chars here.
    if (l.indexOf(k[0])>-1) {
        return t(k.substr(1,k.length));
    } else if (l.indexOf(k[k.length-1])>-1) {
        return t(k.substr(0,k.length-1));
    } else {
        return k;
    }
}
mguven guven
quelle
Es gibt einen subtilen Unterschied zu dem, was gefragt wird! Wenn Sie einen Raum überprüft ' ', aber die Frage ist , über weißen Raum im Allgemeinen, einschließlich "\n", "\t"und andere nicht druckbare Zeichen , die von in regex abgestimmt sind /\s/.
Amenthes
dann können Sie die Bedingung bearbeiten, wenn "als (" \ t \ r \ n ".indexOf (k [0])> - 1)" immer noch funktioniert, das sind bereits bestimmte Typen.
mguven guven