JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで改行を作成・挿入する方法をわかりやすく解説

JavaScriptで改行を作成する基本

JavaScriptで改行を作成するには、HTMLの「<br>」タグを使用します。このタグを活用することで、1つの改行だけでなく、複数の連続した改行を簡単に挿入することも可能です。

例えば、document.write()メソッドで文字列を画面に出力する際に、文字列の中へ<br>を組み込むことで、ブラウザ上に改行を表示させることができます。

サンプルコード

具体的な使い方を、以下の例で確認してみましょう。

<html>
   <body>
      <script>
         <!--
            document.write("Hello World!");
            document.write("<br>");
            document.write("Demo<br><br>Text!");
         //-->
      </script>
   </body>
</html>

実行結果のポイント

このコードを実行すると、まず「Hello World!」が出力され、続く<br>によって改行されます。さらに「Demo」の後には<br>が2つ連続して記述されているため、2行分の空白が挿入された後、「Text!」が表示されます。このように、<br>を重ねることで自由に改行数をコントロールできます。

補足：HTML以外の場面で改行する場合

<br>はあくまでHTMLとして出力される際の改行タグです。alert()ダイアログやconsole.log()のように、HTMLとして解釈されない場面で改行したい場合は、エスケープシーケンス「\n」を使用します。

console.log("1行目\n2行目");

用途に応じて「<br>」と「\n」を使い分けることで、意図した通りの改行処理を実現できます。

  1. 【初心者向け】JavaScriptでカウントダウンタイマーを作成する方法を解説

    Webサイトでは、イベント開始までの残り時間やセールの締め切り表示など、カウントダウンタイマーを設置したい場面は数多くあります。JavaScriptでは、DateオブジェクトとsetInterval()メソッドを組み合わせるだけで、誰でも簡単にカウントダウンタイマーを実装できます。 ここでは、指定した日時までの残り時間を「日・時・分・秒」の形式でリアルタイムに表示するサンプルコードを紹介します。 サンプルコード <!DOCTYPE html> <html> <head> <meta name="viewport" content=&

  2. JavaScriptで定数を作成する方法とは？constキーワードの使い方を実例付きで解説

    JavaScriptで定数を作成するには、constキーワードを使用します。constで宣言された変数は、一度値を代入すると後から再代入することができません。もし再代入を試みると、TypeErrorエラーが発生します。定数作成のコード例以下は、JavaScriptでconstを使って定数を作成し、その値を変更しようとしたときの挙動を確認できるサンプルコードです。サンプルコード<!DOCTYPE html> <html> <head> <style> body { font-family: Segoe UI, Tahoma,