JavaScriptで新しい行を作成するにはどうすればよいですか?


121
var i;
for(i=10; i>=0; i= i-1){
   var s;
   for(s=0; s<i; s = s+1){
    document.write("*");
   }
   //i want this to print a new line
   /document.write(?);

}

星のピラミッドを印刷していますが、新しい行を印刷できません。


5
document.write( "<br>"); // .htmlを使用している場合
jasonleonhard

関連スレッドはこちら
RBT

回答:


195

\n改行文字にはを使用します。

document.write("\n");

複数持つこともできます:

document.write("\n\n\n"); // 3 new lines!  My oh my!

ただし、これがHTMLにレンダリングされる場合は、改行にHTMLタグを使用する必要があります。

document.write("<br>");

Hello\n\nTestソースの文字列は次のようになります。

Hello!

Test

文字列Hello<br><br>Testは、HTMLソースでは次のようになります。

Hello<br><br>Test

HTMLは、ページを表示している人のために改行としてレンダリングさ\nれ、ソース内の次の行にテキストをドロップします(HTMLページ上にある場合)。


5
定義により、OPがを使用している場合document.write、それはXHTMLページではなくHTMLページです。<br>HTMLページの正しい改行です。<br />XHTMLです。
TJクロウダー

1
<br>すごいありがとう
Jeya Suriya Muthumari

31

どのように:

document.write ("<br>");

(あなたがhtmlページにいると仮定します、ラインフィードだけがスペースとしてしか表示されないので)


9

<br>タグを使用してドキュメントに改行を作成する

document.write("<br>");

これがフィドルのサンプルです


1
これは、OPが実際に探しているもののようです:)(br vs \ n)
デミアンブレヒト

どうして知っていますか?BRを指摘するのは良いことですが、PREも同様に簡単に導入できたでしょう。彼らがアスキーアートを構築している場合、私の考えはプレーンテキストだと思います。
Jared Farrish

@Jared:document.writeプレーンテキストドキュメントをどのように呼び出しますか?(たとえば、scriptタグをどのように挿入しますか?)preただし、の良い点は、簡単にpreセクションにすることができます。
TJクラウダー

@TJ-表示はASCIIアートのようにプレーンテキストです。それはまだHTMLドキュメントですが、プレーンテキスト表示として表示しているだけです。
Jared Farrish

@Jared:ええ、私はあなたの主張を引き受けました。(あなたの他のビットはtext/plainドキュメントについてだと思ったpreが、良い点であることは明らかだったと思う。)
TJクラウダー

4

使用"\n"

document.write("\n");

改行として解釈されるようにするには、二重引用符で囲む必要があります。いいえ、ありません。


1
HTMLページに改行を出力しても、HTMLドキュメントに改行が導入されることはありません。(そして、それは二重引用符である必要はありません、単一引用符も同様に結構です。)
TJ Crowder '22

@TJ-PREが関与していない限り?
Jared Farrish 2011

ああ、あなたのポイントがpre要素に関する別の答えにコメントすることを除いて。いい視点ね。preセクションにアスキーアートを出力する場合\nは、正しいかもしれません...(編集:LOL、コメントの重複。)
TJクラウダー

@TJクラウダー-これは私が意味したことの例です(厳しく
Jared

@ジャレッド:ああ、あなたのコメントpreは完全に明確でした。(あなたのためにタグを閉じました:jsfiddle.net/wT3Ab/1)ベスト、
TJクロウダー

3

document.writeln()あなたが探しているものであるか、またはdocument.write('\n' + 'words')新しい行が使用されるときにより細かい点を探しているかどうか



2

新しいラインを作成するには、シンボルは '\ n'です

var i;
for(i=10; i>=0; i= i-1){
   var s;
   for(s=0; s<i; s = s+1){
    document.write("*");
   }
   //i want this to print a new line
   document.write('\n');

}

ページに出力する場合は、の"<br/>"代わりに使用する必要があり'/n'ます。

JavaScriptのエスケープ文字


二重引用符で囲む必要はありませんか?
Jared Farrish

5
JavaScriptで二重引用符と単一引用符が同じになることはありません。二重引用符で始めて単一引用符で終わることはできません。
kemiller2002

まあ、私はそれを知っています。JSではシングルとダブルが同じように扱われることを知りませんでした。PHPでスタックする必要があります。
Jared Farrish

言語間を移動することは常に
骨の折れる作業です

知ってよかった、ありがとう。毎日新しいことを学びましょう。:)無害なエラーでしょう。
Jared Farrish

2

HTMLページ:

document.write("<br>"); 

ただし、JavaScriptファイルを使用している場合、これは新しい行として機能します。

document.write("\n");

1

文字列の場合、"\n"新しい行を追加するために書くだけです。たとえば、console.log("First Name: Rex" + "\n" + "Last Name: Blythe");

名:レックス

姓:ブライス


1

このような星のピラミッドもできます

for (var i = 5; i >= 1; i--) {
     var py = "";
     for (var j = i; j >= 1; j--) {
         py += j;

     }
     console.log(py);
 }

0

\ n->改行文字は改行の挿入に機能しません。

    str="Hello!!";
    document.write(str);
    document.write("\n");
    document.write(str);

しかし、以下のコードを使用すると、問題なく機能し、新しい行が表示されます。

    document.write(str);
    document.write("<br>");
    document.write(str);

注:Visual Studio Codeで試しました。


これは、テキストがHTMLとして表示されることを前提としています。それが本当にここでの一般的な答えであるならば、問題ではありません。
GhostCat 2017

0

あなたの解決策は

var i;
for(i=10; i>=0; i= i-1){
   var s;
   for(s=0; s<i; s = s+1){
    document.write("*");
   }
   //printing new line
   document.write("<br>");
}


-1

JavaScriptファイル(.js)を使用している場合は、を使用しますdocument.write("\n");。HTMLファイル(.htmlまたは。htm)を使用している場合は、を使用しますdocument.write("<br/>");


-1
document.write("\n");

実行している場合は機能しません(document.write();)を複数回。

私はあなたが行くべきであることをお勧めします:

document.write("<br>");

PS私は人々がこの答えを上に述べたことを知っていますが、どこにも違いを見つけなかったので:)



-1

以下のリンクを使用できます:JavaScriptの新しい行

  var i;
for(i=10; i>=0; i= i-1){
   var s;
   for(s=0; s<i; s = s+1){
    document.write("*");
   }
   //i want this to print a new line
   /document.write('<br>');

}

1
あなたのリンクは壊れており、あなたのコード例は2011年から受け入れられた答えがまだ言っていないことを何も言っていません。
クエンティン、

まあ、リンクが固定されているが、それは説明-無料デモを指し、あなたはまだ、すでに今は何も言っていませんが、2011年に言った
クエンティン
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.