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?


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


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);

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();

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)



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   "));

\ 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);
}

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, '-');

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?");

:) :)


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()));
  });
});

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).


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

var x = $.trim(word);

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

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;
    }
}

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
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.