JavaScript字符串换行符?


424

\n在Javascript中所有平台的通用换行字符序列?如果不是,我如何确定当前环境的角色?

我不是在问HTML换行符(<BR/>)。我问的是JavaScript字符串中使用的换行符序列。


5
我有一个多行输入控件,希望用户在其中输入换行符分隔的列表。我需要首先在换行符上分割字符串来解析列表。
Landon Kuhn

7
@ landon9720:对于我的多行输入控件,我有一个getValue函数接受value和返回value.replace(/\r\n/g,'\n')-只是为了使输出在浏览器/平台之间保持一致。
罗伊·廷克

1
很好的问题,特别是对于那些刚接触编程的人!在HTML和JavaScript之外,最好知道如何跳到下一行/新行。
埃里克·比斯哈德

Answers:


362

我刚刚使用此愚蠢的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>

Windows上使用IE8和Opera 9 \r\n。我测试过的所有其他浏览器(Windows上的Safari 4和Firefox 3.5,Linux上的Firefox 3.0)都使用\n\n设置该值时,它们都可以很好地处理,尽管IE和Opera会在\r\n内部将其再次转换回该值。有SitePoint文章,其中有更多详细信息,称为Java中的行尾

还要注意,这与HTML文件本身中的实际行尾(\n\r\n给出相同的结果)无关。

提交表单时,所有浏览器都会以%0D%0AURL编码规范化换行符。要看到这一点,请加载例如data:text/html,<form><textarea name="foo">foo%0abar</textarea><input type="submit"></form>,然后按提交按钮。(某些浏览器阻止了已提交页面的加载,但是您可以在控制台中看到URL编码的表单值。)

不过,我认为您真的不需要做任何决定。如果只想在换行符上分割文本,则可以执行以下操作:

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

14
为我工作,但必须使用全局标志:/ \ r \ n | \ r | \ n / g
AdrianoFerrari 2012年

17
@Edson是错误的,因为它将被\r\n视为两个换行符而不是一个。如果您想简短一点,/\r?\n/g可能会做(谁仍然使用Mac OS 9?)。
墨卡托

1
鉴于SitePoint文章来自2004年,因此那里的信息可能与当前的JS实现无关。
cbmanica 2013年

据说比赛比拆分要快得多:jsperf.com/regex-split-vs-match
Wilt

这似乎有些矫kill过正,请参阅下面的答案以获取更简单的解决方案!
卡西姆

81

是的,它是通用的。

尽管'\n'是通用的换行符,但必须记住,根据您的输入,换行符可能会以回车符('\r')开头。


55
\ n是通用换行符(LF)。确切的换行字节序列取决于平台(\ r \ n,\ n或\ r:en.wikipedia.org/wiki/Newline)。这就是兰登在问的问题。当您首先说这是通用换行符,然后说它可能带有CR时,您就与自己矛盾。哪一个?
墨卡托

2
\ n是换行符(换行符),即使它前面有回车符也是如此。尽管大多数Windows API和应用程序会将CR解析为换行符,但是CR绝对不能单独使用。LF在Windows中也同样有效。从计算机仅仅是电子打字机的那一刻起,CR就是一种人工产物。
GolezTrol 2011年

3
@GolezTrol有充分的理由自行使用CR。例如,在控制台窗口中返回到该行的开头以覆盖该行,而无需移动到下一行。这通常用于在命令行实用程序中编写变化的进度百分比指示符。
丹·贝查德

2
@丹感谢您的反馈。当然,我永远不应该说“从不”,因为确实有CR本身的申请。但是问题是关于Javascript而不是命令行实用程序。当然,可能会有一个脚本在CLI模式下运行(尽管我不知道CR是否会像您之前所说的那样工作),您甚至可以使用Javascript生成在命令行中运行的脚本。这些是规则的可能例外,但是在问题的上下文中,它们似乎并不适用。不过,感谢您提及它。
GolezTrol 2015年

65

不要使用“ \ n”。尝试一下:

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

只需输入反斜杠并继续进行即可!奇迹般有效。


ES6还支持带有tilde字符的多行值(否则称为反引号)。
卡西姆

10
@Qasim-仅供参考,我相信波浪号和反引号是不同的字符,请参见~Tilde vs `Backtick
克里斯·伯吉斯

1
啊-是的,您是对的。ES6对多行字符串使用反引号字符
Qasim

2
尽管是合法的,但在JS界对此并不满意。它缺乏可读性。如果可以,请使用ES6的反引号。如果不是,则\ n
gotofritz

3
在编写代码时,这有效。看起来,OP似乎是从文本区域解析文本。
jinglesthula

53

仅处理换行符的所有情况,而不是先检查哪种情况然后再应用它,可能是最简单的。例如,如果您需要替换换行符,请执行以下操作:

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

1
高超。在更高版本的FF和IE(尽管未测试较早的版本)中工作得很好
EvilDr

25

是的,请使用\ n,除非您要生成要在其中使用的html代码 <br />


13

电子邮件链接功能我使用“%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>

有人知道Tab键的这种代码类型吗?我尝试使用“%0D%09”但无法正常工作。
Nilay 2015年

7

获取当前浏览器的行分隔符:

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

3
怎么return textarea.value;
XP1 2012年

JSON.stringify在结果上使用会改变字符吗?如果我尝试在alert()通话中查看结果,除非我先将其字符串化,否则它不会显示该字符(当然,不是字符必须为人类可读才能有效)

4

注意-使用ExtendScript JavaScript(在Photoshop CS3 +等应用程序中使用的Adobe脚本语言)时,使用的字符为“ \ r”。“ \ n”将被解释为字体字符,因此许多字体将改为具有块字符。

例如(要选择一个名为“ Note”的图层并在所有期间后添加换行符):

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

试图找出原因\n<br/>而不在我的Photoshop脚本中工作...谢谢!
杰克·斯托弗勒2014年

3

您可以在ES6中使用``引号(Esc按钮下方的引号)。所以你可以这样写:

var text = `fjskdfjslfjsl
skfjslfkjsldfjslfjs
jfsfkjslfsljs`;

1

我相信是-当您使用JS字符串时。

但是,如果要生成HTML,则必须使用<br />标签(不是\n,因为您不再使用JS了)


1

我有用\ n\ r \ n表示换行的问题。
神奇的是,用于回车的字符\ r像换行符一样为我工作。
因此,在某些情况下,考虑\ r也很有用。


如果您的字符串具有ISO-8859-1字符集
则会

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

印刷品:

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

0

实际观察...在我的NodeJS脚本中,我具有以下功能:

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

首先,我只有“ \ n”,但是我注意到在记事本中打开日志文件时,它在同一行显示所有条目。另一方面,Notepad ++在各自的行上显示条目。将代码更改为“ \ r \ n”后,即使记事本也会在每行中显示每个条目。


-3

\n是我遇到的所有情况就好了。如果您正在使用Web,请使用它\n,不用担心(除非您有与换行有关的任何问题)。


By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.