JavaScript znak nowej linii?


424

Czy \nuniwersalna sekwencja znaków nowego wiersza w Javascript dla wszystkich platform? Jeśli nie, jak określić postać dla bieżącego środowiska?

Nie pytam o element HTML nowej linii ( <BR/>). Pytam o sekwencję znaków nowego wiersza używaną w ciągach JavaScript.


5
Mam kontrolę wprowadzania wielowierszowego, w której użytkownik powinien wprowadzić listę oddzieloną nową linią. Muszę przeanalizować listę, najpierw dzieląc ciąg znaków na znaki nowej linii.
Landon Kuhn

7
@ landon9720: W przypadku moich kontrolek wprowadzania wielowierszowego mam getValuefunkcję, która przyjmuje valuei zwraca value.replace(/\r\n/g,'\n')- tylko po to, aby zachować spójność danych wyjściowych między przeglądarkami / platformami.
Roy Tinker,

1
Dobre pytanie szczególnie dla tych, którzy dopiero zaczynają programować! Poza HTML i JavaScriptem dobrze jest wiedzieć, jak przejść do następnej / nowej linii.
Eric Bishard,

Odpowiedzi:


362

Właśnie przetestowałem kilka przeglądarek przy użyciu tego głupiego kodu JavaScript:

function log_newline(msg, test_value) {
  if (!test_value) { 
    test_value = document.getElementById('test').value;
  }
  console.log(msg + ': ' + (test_value.match(/\r/) ? 'CR' : '')
              + ' ' + (test_value.match(/\n/) ? 'LF' : ''));
}

log_newline('HTML source');
log_newline('JS string', "foo\nbar");
log_newline('JS template literal', `bar
baz`);
<textarea id="test" name="test">

</textarea>

IE8 i Opera 9 w systemie Windows \r\n. Wszystkie pozostałe przeglądarki, które testowałem (Safari 4 i Firefox 3.5 w systemie Windows i Firefox 3.0 w systemie Linux) używają \n. Wszystkie mogą \ndobrze sobie poradzić przy ustawianiu wartości, chociaż IE i Opera przekonwertują ją z \r\npowrotem wewnętrznie. Istnieje artykuł SitePoint z kilkoma dodatkowymi szczegółami o nazwie Zakończenia linii w JavaScript .

Należy również zauważyć, że jest to niezależne od rzeczywistych zakończeń linii w samym pliku HTML (zarówno \ni \r\ndają takie same wyniki).

Podczas przesyłania formularza wszystkie przeglądarki kanonizują znaki nowej linii %0D%0Aw kodowaniu adresów URL. Aby to zobaczyć, załaduj np. data:text/html,<form><textarea name="foo">foo%0abar</textarea><input type="submit"></form>I naciśnij przycisk wysyłania. (Niektóre przeglądarki blokują ładowanie przesłanej strony, ale w konsoli można zobaczyć wartości formularza zakodowane w adresie URL).

Nie sądzę jednak, aby naprawdę trzeba było wiele decydować. Jeśli chcesz po prostu podzielić tekst na nowe wiersze, możesz zrobić coś takiego:

lines = foo.value.split(/\r\n|\r|\n/g);

14
Pracował dla mnie, musiałem jednak użyć flagi globalnej: / \ r \ n | \ r | \ n / g
AdrianoFerrari

17
@Edson i źle, ponieważ będą traktowane \r\njak dwie nowe linie zamiast jednej. Jeśli chcesz krótko, /\r?\n/gprawdopodobnie zrobi to (kto nadal używa Mac OS 9?).
mercator

1
Biorąc pod uwagę, że artykuł SitePoint pochodzi z 2004 r., Informacje tam zawarte mogą nie być istotne dla bieżących implementacji JS.
cbmanica

Mecz jest podobno znacznie szybszy niż split: jsperf.com/regex-split-vs-match
Wilt

To wydaje się być przesadą, zobacz moją odpowiedź poniżej, aby uzyskać prostsze rozwiązanie!
Qasim

81

Tak, jest uniwersalny.

Chociaż '\n'są to uniwersalne znaki nowej linii , należy pamiętać, że w zależności od wprowadzonych znaków, nowe znaki linii mogą być poprzedzone znakami powrotu karetki ( '\r').


55
\ n jest uniwersalnym znakiem przesunięcia wiersza (LF). Dokładna sekwencja bajtów nowej linii zależy od platformy (\ r \ n, \ n lub \ r: en.wikipedia.org/wiki/Newline ). I to pytanie zadaje Landon. Zaprzeczasz sobie, kiedy po raz pierwszy mówisz, że jest to uniwersalny znak nowej linii, a następnie mówisz, że może być poprzedzony CR. Który to?
mercator,

2
\ n jest znakiem nowego wiersza (wstawiania wiersza), nawet jeśli poprzedza go powrót karetki. CR nigdy nie powinien być używany samodzielnie, chociaż większość aplikacji i aplikacji systemu Windows przeanalizuje go jako nową linię. LF działa równie dobrze w systemie Windows. CR to tylko artefakt z czasów, gdy komputery były jedynie elektronicznymi maszynami do pisania.
GolezTrol

3
@GolezTrol Istnieją ważne powody, by używać CR samodzielnie. Na przykład powrót do początku linii w oknie konsoli w celu zastąpienia linii bez przechodzenia do następnej linii. Jest to często używane do zapisywania zmieniających się procentowych wskaźników postępu w narzędziach wiersza poleceń.
Dan Bechard

2
@ Dan Dziękuję za opinię. Oczywiście, nigdy nie powinienem był mówić „nigdy”, ponieważ w rzeczywistości istnieją same wnioski o CR. Ale pytanie dotyczy Javascript, a nie narzędzi wiersza poleceń. Oczywiście może istnieć skrypt działający w trybie CLI (chociaż nie wiem, czy CR będzie działał tak, jak powiedziałeś wtedy), a nawet możesz użyć Javascript, aby wygenerować skrypt uruchamiany w wierszu poleceń. Są to możliwe wyjątki od reguły, ale w kontekście pytania wydają się nie mieć zastosowania. Niemniej jednak dziękuję za wzmiankę o tym.
GolezTrol,

65

Nie używaj „\ n”. Po prostu spróbuj tego:

var string = "this\
is a multi\
line\
string";

Po prostu wprowadź ukośnik i kontynuuj jazdę! Działa jak marzenie.


ES6 obsługuje również wartości multilinii ze tildeznakiem (inaczej nazywany backstick).
Qasim

10
@Qasim - FYI, uważam, że tylda i backtick to różne postacie, patrz ~Tilde vs `Backtick .
Chris Burgess,

1
Ah - Tak, masz rację. ES6 używa znaku wstecznego dla ciągów wielowierszowych
Qasim

2
Chociaż jest to legalne, jest to niezadowolone w kręgach JS. Brakuje czytelności. jeśli możesz, użyj wstecznych ES6. Jeśli nie, \ n
gotofritz

3
Podczas pisania kodu to działa. Wygląda na to, że OP polega na analizowaniu tekstu z obszaru tekstowego.
jinglesthula

53

Najłatwiej jest po prostu obsłużyć wszystkie przypadki nowego znaku linii zamiast sprawdzania, który przypadek następnie zastosować. Na przykład, jeśli chcesz zastąpić nowy wiersz, wykonaj następujące czynności:

htmlstring = stringContainingNewLines.replace(/(\r\n|\n|\r)/gm, "<br>");

1
Wspaniały. Działa świetnie w późniejszych wersjach FF i IE (chociaż nie testowano starszych wersji)
EvilDr


13

Funkcja linku e-mail używam „% 0D% 0A”

function sendMail() {   
var bodydata="Before "+ "%0D%0A";
    bodydata+="After"

var MailMSG = "mailto:aaa@sss.com" 
         + "?cc=07@sss.com" 
         + "&subject=subject" 
         + "&body=" + bodydata; 
window.location.href = MailMSG; 
} 

[HTML]

<a href="#" onClick="sendMail()">Contact Us</a>

ktoś zna ten typ kodu klawisza Tab? próbuję "% 0D% 09", ale nie działa.
Nilay

7

Uzyskaj separator linii dla bieżącej przeglądarki:

function getLineSeparator() {
  var textarea = document.createElement("textarea");
  textarea.value = "\n"; 
  return textarea.value;
}

3
Jak o return textarea.value;?
XP1

Czy użycie JSON.stringifywyniku zmieni postać? Jeśli spróbuję wyświetlić wynik w alert()wywołaniu, nie pokaże mi znaku, chyba że najpierw go skreślę (nie chodzi o to, że znak musi być czytelny dla człowieka, aby był skuteczny)

4

Uwaga - podczas korzystania z ExtendScript JavaScript (języka Adobe Scripting używanego w aplikacjach takich jak Photoshop CS3 +), używanym znakiem jest „\ r”. „\ n” będzie interpretowane jako znak czcionki, a zatem wiele czcionek będzie miało znak blokowy.

Na przykład (aby wybrać warstwę o nazwie „Uwaga” i dodać informacje o wierszach po wszystkich kropkach):

var layerText = app.activeDocument.artLayers.getByName('Note').textItem.contents;
layerText = layerText.replace(/\. /g,".\r");

Próbowałem dowiedzieć się, dlaczego \ni <br/>nie działałem w moim skrypcie Photoshop ... Dzięki!
Jake Stoeffler

3

Możesz użyć cudzysłowu (które są poniżej przycisku Esc) w ES6. Możesz więc napisać coś takiego:

var text = `fjskdfjslfjsl
skfjslfkjsldfjslfjs
jfsfkjslfsljs`;

1

Wierzę, że tak - kiedy pracujesz z ciągami JS.

Jeśli jednak generujesz HTML, będziesz musiał użyć <br />tagów (nie \n, ponieważ nie masz już do czynienia z JS)


1

Miałem problem z wyrażeniem nowej linii za pomocą \ n lub \ r \ n .
Magicznie postać \ r , który jest używany do powrotu karetki pracował dla mnie jak znak nowej linii.
Dlatego w niektórych przypadkach warto rozważyć również r.


Dzieje się tak, jeśli Twój ciąg znaków ma
zestaw

0
printAccountSummary: function()
        {return "Welcome!" + "\n" + "Your balance is currently $1000 and your interest rate is 1%."}
};
console.log(savingsAccount.printAccountSummary()); // method

Wydruki:

Welcome!
Your balance is currently $1000 and your interest rate is 1%.

0

Praktyczna obserwacja ... W moim skrypcie NodeJS mam następującą funkcję:

function writeToLogFile (message) {
    fs.appendFile('myserverlog.txt', Date() + " " + message + "\r\n", function (err) {
        if (err) throw err;
    });
}

Najpierw miałem tylko „\ n”, ale zauważyłem, że kiedy otwieram plik dziennika w Notatniku, pokazuje on wszystkie wpisy w tym samym wierszu. Z drugiej strony Notepad ++ pokazuje wpisy w osobnych wierszach. Po zmianie kodu na „\ r \ n” nawet Notatnik pokazuje każdy wpis we własnej linii.


-3

To \njest w porządku dla wszystkich przypadków, które napotkałem. Jeśli pracujesz z siecią, korzystaj z niej \ni nie przejmuj się nią (chyba że masz jakieś problemy związane z nową linią).


-13

można użyć <br/>a document.write/, document.writelnjeden.


4
Przeczytaj ponownie pytanie. Mówi konkretnie, że nie pyta<br>
Leigh
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.