ホームページ  >  記事  >  ウェブフロントエンド  >  Js のコンソール オブジェクトを使用してコンソールにデバッグ情報を出力し、Js の実装をテストします。

Js のコンソール オブジェクトを使用してコンソールにデバッグ情報を出力し、Js の実装をテストします。

高洛峰
高洛峰オリジナル
2016-12-05 10:49:581373ブラウズ

たまたま、Baidu を開くときに F12 を押したところ、Baidu の求人広告がコンソールに表示され、非常にクールに感じたので、このブログ記事を思いつきました。

このようにコンソール上に情報を出力できるので、今後Jsをデバッグする際にかなり手間が省けるのではないでしょうか?他の人に誤解を与えないよう、特に for(var i in console) を使用して、さまざまなブラウザー コンソールのコンソール サポートを確認しました。結果は次のとおりです。

IE 11 console

log 、 info 、 warn 、 error 、 debug 、assert 、 time、timeEnd、group、groupCollapsed、groupEnd、trace、clear、dir、dirxml、count、countReset、cd、select、profile、profileEnd

Firebug Console

log、debug、info、warn、例外、assert、dir、dirxml 、トレース、グループ、groupCollapsed、groupEnd、profile、profileEnd、count、clear、time、timeEnd、timeStamp、table、error

Chrome Console

memory、_commandLineAPI、debug、error、info、log、warn、dir、dirxml、 table 、trace、assert、count、markTimeline、profile、profileEnd、time、timeEnd、timeStamp、timeline、timelineEnd、group、groupCollapsed、groupEnd、clear

上記でテストしたブラウザは、次の 5 つの基本的なメソッドに適していることがわかります。ログ、情報、警告、エラー、デバッグはすべてサポートされています。IE 11 を使用していることに注意してください。Firefox 自体にはコンソールがありません。Firebug プラグインをロードして起動する必要があります。 . をコンソールに送信しないと、Js がエラーを報告します。より使いやすくするために、自分でカプセル化して、ブラウザーのコンソールのサポートを確認することができます。サポートされていない場合は、独自のアラートまたは他の方法を使用するしかありません。

簡単な使用法:

console.log (「ログ情報」);

console.debug (「警告プロンプト」);

console.error("エラーメッセージ");

フォーマットされた出力:

console.log("%d year %d month %d day", 2014, 5, 20); // 日付形式の出力

console. ('%c 色付き出力情報', 'color:white; background-color:#0055CC');//出力のフォーマット

出力変数:

var who= 'you';

console.log( '出力変数私たちは ' をサポートします);//変数

出力配列を読み取ります:

var arr = [1, 2, 3, 4, 5];//出力配列


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。