【Firefox】 開発ツールの「コンソール」で複数行のコードを実行する

この記事は約2分で読めます。

開発ツールの「コンソール」画面

こんにちは、さち です。

先日、ちょっとした JavaScript のテストをしたくて、Firefox の開発ツールにある「コンソール」を使っていました。

ただ、「コンソール」は、コードを1行入力するとすぐに実行する仕様。複数行のコードをテストしたい時には少し不便です。

普通のコードエディターのように、複数行入力する方法ってないの?

スポンサーリンク

コードが1行ずつ実行される

  1. Firefox でこのブログを開きます。
    このブログのトップページ
  2. 開発ツール(Ctrl + Shift + I キー)の「コンソール」を開いて、このような JavaScript を実行して、サイト名を取得して表示してみます。
    let elm = document.querySelector('title');
    let text = '【サイト名】' + elm.innerText;
    console.log(text);
  3. 「コンソール」は基本的に1行ずつ実行するスタイルなので、こんな感じになります。1行毎にレスポンスが返ってくるので、正直見にくいです。
    開発ツールの「コンソール」画面

マルチラインモードを使う

  1. 開発ツール(Ctrl + Shift + I キー)の「コンソール」を開きます。
    開発ツールの「コンソール」画面
  2. 右端にある「マルチラインモード」ボタンをクリックします。(Ctrl + B キーでもOK)
    「マルチラインモード」アイコン
  3. コードエディターのように複数行を記述できるようになりました。
    開発ツールの「コンソール」画面
  4. 左上にある「実行」ボタンをクリックします。(Ctrl + Enter キーでもOK)
    「実行」ボタン
  5. 実行結果が、右側のエリアに表示されます。
    開発ツールの「コンソール」画面

ちなみに、あまりおすすめしませんが、「マルチラインモード」でない場合でも、Shift + Enter キーを押すことで複数行にできます。

コメント

タイトルとURLをコピーしました