povnuのVikoristovuemoコンソール。 JavaScriptの紹介-簡単なひねり

ゴロフナ / グーグルプレイ
公開日:2013年3月26日

Chrome開発者ツール-私の意見では、最高のWeb開発ツールです。 必要なすべてのWebアドオンの作成と拡張に必要なすべての機能に復讐します。 彼と一緒にエール、まるで私が他の道具であるかのように、あなたは練習の仕方を学ぶ必要があります。 基本から始めましょう。

コンソールは、インタラクティブなJavaScriptインタープリターの役割を果たします。 彼らはまた、仕事とウェブプログラムの時間のせいにされている恩赦を持っています。 タブの近くにいる場合は、Escをクリックするか、画面の左下隅にあるコンソールアイコンをクリックすると、他のすべてのタブでコンソールを使用できます。

コンソールを使用すると、小売業者は低レベルの基本機能にアクセスできます。 主なものを見てみましょう:

console.log()、console.error()、console.warn()およびconsole.debug()

コンソールに表示する基本機能を使用すると、コンソールに追加のメッセージを表示できます。 次の警告の分類が考慮されます。error()は許しとしての警告を意味し、warn()は警告としての警告を意味し、debug()は警告としての警告を意味します。


これらの関数は無制限の数のパラメーターを受け入れます。これにより、過去の多くの変更を入力して、次の提案にまとめることができます。

Console.log( "登録時間:"、1121102802);

また、єpodtrimkaformatuvannya:

Console.log( "登録時間:%d"、1121102802);

サポートされているVkazіvniki形式:

//%s-行console.log( "%s"、 "Hi"); //%d、%i-整数console.log( "%d"、1337/42); //%f-浮動小数点数console.log( "%f"、1337/42); //%oはDOM要素ですconsole.log( "%o"、document.body); //またはconsole.dirxml(document.body); //%OはJavaScript要素ですconsole.log( "%O"、document.body); //またはconsole.dir(document.body); //%c-CSSスタイル設定を表示しますconsole.log( "%cset%clight"、 "color:red"、 "color:blue");


コンソールtrace()

コード内のドットからのツイートのスタックを表示します。deboovtweetメソッド。 wikiスタックには、ファイル名と行番号に加えて、trace()メソッドのタグタグが1つのドットに含まれています。


console.assert()

assert関数は、最初のパラメーターによって渡された値をチェックし、パードンと同様に、コールスタックからコンソールにパードンを一度に書き込みます:

var two = 3; var three = 2; console.assert(two< three, "два меньше трех");

console.group()、console.groupCollapsed()およびconsole.groupEnd()

invivoduでのグループ化の機能。 group()関数は、更新するグループを返します。パラメーターとして、グループの名前を受け入れ(フォーマットはconsole.log()のようにフォーマットされます)、groupEnd()関数は残りを閉じます。 グループ。 groupCollapsed()関数はgroup()関数に似ていますが、 グループを作成しました zamovchuvannyamの思い出。

console.time()およびconsole.timeEnd()

コードの時間を計算するための関数。 time()関数はタイマーを開始し、timeEnd()関数はタイマーを呼び出してその値を表示します。 デフォルトの関数は、タイマーの名前をバインディングパラメーターとして受け入れます。


フィルタを思い出させる

エクスパンションのコンソールのインサートの右下隅に、タイプの後にフィルターが表示されます。 すべてがすべての警告を促します、エラー-console.error()関数の許しと表示、警告-console.warn()関数の遅延と表示、ログ-console.log()関数の出力、デバッグ- console.debug()関数、console .timeEnd()その他の情報。

他のタブとの相互作用

デバッガ;

ブラウザがデバッガの行に到達したとき。 どのコードでも、スクリプトはこの時点でスクリプトを自動的にダウンロードし、[スクリプト]タブ([ソース])に移動します。


$()、$$()および$ x()

要素の選択を簡素化する機能は、コンソールで実行される可能性が低くなります。 $()関数は、渡されたセレクターに一致する最初の要素をローテーションします。 別のパラメータとして、コンテキストをジョークに渡すことができます。

$( "head")//ヘッド要素を回転させます$( "head"、document.body)//ボディがヘッド要素をオーバーライドしないようにnullを回転させます

$$()関数は$()に似ていますが、すべての既知の要素をローテーションします。

$$( "script")//すべてのスクリプト要素をローテーションします$$( "script"、document.body)//本文に含まれるすべてのスクリプト要素をローテーションします

$ x()関数は、XPath式に一致するすべての要素をローテーションします。 コンテキストを別のパラメーターとして渡すことができます。

$ x( "// script")//すべてのスクリプト要素を回転させます$ x( "script"、document .body); //本文内で移動するすべてのスクリプト要素を回転させます

多くのJavaScriptフレームワークは$()関数を割り当て、コンソール関数の値もそれに関連して変更されます。

$0 — $4

コンソールは、[要素]タブに表示される残りの5つの要素をメモリから保存します。 それらにアクセスするには、$ 0、$ 1、$ 2、$ 3、および$4を変更する必要があります。 $ 0は要素を表示するための料金を節約し、$ 1 —前面などを節約します。


$_

変更$_コンソールコマンドの残りの部分を実行した結果を取得します。 Tseを使用すると、あるチームの結果を別のチームで勝ち取ることができます。 cherzіでvikonatitіコマンドを試してください:

1337/42; console.log( "%d"、$ _);

inspect()

inspect()関数は、入力入力で渡されるオブジェクトまたは要素を検査します。

Inspect($( "head script"))// [要素]タブを表示し、最初のスクリプトタグを表示して中央の頭を見つけます


物体 コンソールブラウザの拡張機能(Firefox用のWebコンソールなど)にアクセスするために勝ちます。 彼との仕事は さまざまなブラウザ、ale qiメソッドと事実の背後にある力は、usimaブラウザーによってサポートされています。

へのアクセス コンソールグローバルオブジェクトの力を通して見ることができます。つまり、ブラウザ用のウィンドウ(JavaScript)、ワーカー用のWorkerGlobalScope 特別な方法電源コンソールを介したアクセス。 VіdomyyakWindow.consoleであり、簡単にするために、「コンソール」のように参照します。

Console.log( "指定されたリンクを開くことができませんでした")

methodi

Console.assert()最初の引数がfalseであるため、コンソール(Webコンソールからアクセス可能)がスタックをメソッドにアサートすることを示します。 Console.clear()コンソールをクリアします。 Console.count()シングルサインオンでメソッドのクリック数を表示します(メソッドにパラメーターとして渡されます)Console.debug()log()の同義語Console.dir() 指定されたJavaScriptの機能のインタラクティブなリストを表示します。 その力の娘オブジェクトのこのリストを見てみましょう。 Console.dirxml()

可能であれば、指定されたオブジェクトの表現をXML/HTML形式で表示します。 これはJavaScriptオブジェクトではありません(「console.dir()」のように見えます)。

Console.error()許しの通知を表示します。 フォーマットについては、Console._exception()をひねることができます error();の同義語 Console.group()新しいグループを作成し、次のすべての行を追加して、1行右に移動します。 グループを終了するには、groupEnd()を呼び出します。 Console.groupCollapsed()アラートの新しいグループを作成し、すべての増分を1レベル右にプッシュします。 visnovokのgroup()のビューで、選択したグループを入力します。ボタンの後で手動で開く必要があります。 グループを終了するには、groupEnd()を呼び出します。 Console.groupEnd()スレッドグループを終了します。 Console.info() 情報アラート。 フォーマットについては、追加のパラメータで置換記号(マスク)を変更することができます。 Console.log()情報を表示するための優れた方法。 フォーマットについては、追加のパラメータで置換記号(マスク)を変更することができます。 Console.profile() ブラウザの実行中にプロファイラを起動します(Firefoxパフォーマンスツールなど)。 プロファイルバッジを入力できます(バザニー用)。 Console.profileEnd() 結果は、ブラウザーのパフォーマンス分析ツール(Firefoxパフォーマンスツールなど)で確認できます。 Console.table()テーブルビューにテーブルデータを表示します。 Console.time()指定されたパラメーター名でタイマーを開始します。 サイドでは、1時間あたり最大10,000個のタイマーを実行できます。 Console.timeEnd()タイマーを呼び出し、開始から何秒経過したかをビームに書き込みます。 Console.timeStamp() ブラウザの生産性向上ツールであるタイムラインまたはウォーターフォールにマーカーを配置します。 Console.trace()スタックトレースを表示します。 Console.warn()事前に警告を表示します。 フォーマットについては、追加のパラメータで置換記号(マスク)を変更することができます。

Vikoristannya

コンソールでのテキストの表示

ほとんどの場合、コンソールは、テキストの行やその他のタイプのデータを表示するために勝利を収めています。 次のカテゴリを使用して、関数console.log()、console.info()、console.warn()、console.error()を作成する方法を確認してください。 Їхvysnovokstylіzirovaniyaは別の方法で、あなたはvikoristovuvavatіltry、scho nadayutsyaブラウザ、schob bachitのみのスピーチ、schoyoutsіkavlyatをすることができます。

Є視覚のvikoristannya機能の2つの方法。 1行に表示されるオブジェクトのリストを渡すだけで、その後コンソールに表示されます。または、置換文字と置換用のオブジェクトパラメータのリストを含む行を引用することができます。

1つのオブジェクトのビジョン

1つのオブジェクトを表示する最も簡単な方法:

Var someObject =(str: "Some text"、id:5); コンソールログ(someObject);

Visnovokは次のようになります。

((str: "Some text"、id:5))

たくさんの物を見る

呼び出されている関数でオブジェクトをオーバーライドするだけで、いくつかのオブジェクトを表示できます。

Var car="ダッジチャージャー"; var someObject =(str: "Some text"、id:5); console.info( "私の最初の車は"、car、 "でした。オブジェクトは次のとおりです:"、someObject);

Visnovokは次のようになります。

私の最初の車はダッジチャージャーでした。 オブジェクトは次のとおりです:((str: "Some text"、id:5))

マスクの行を作り直す

Gecko 9.0(Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)は、ワイルドカード文字(ワイルドカード)をサポートしています。 行をいずれかのメソッドに転送すると、次のキャラクターを獲得できます。

スキンマスクは、パラメータのリストから攻撃的な引数を選択します。 お尻:

For(var i = 0; i<5; i++) { console.log("Hello, %s. You"ve called me %d times.", "Bob", i+1); }

Visnovokは次のようになります。

こんにちはボブ。 あなたは私に1回電話をかけました。こんにちは、ボブ。あなたは私に2回電話をかけました。 こんにちはボブ。 あなたは私に3回電話をかけました。こんにちは、ボブ。あなたは私に4回電話をかけました。 こんにちはボブ。 あなたは私に5回電話しました。

コンソールビューのスタイル化

「%c」ディレクティブを微調整して、コンソールに表示する1時間のCSSスタイルを挿入できます。 ディレクティブの前のテキストの一部はスタイル設定されておらず、その後のテキストの一部はスタイル設定されます。

Console.log( "これは%cMyスタイリッシュメッセージです"、 "color:yellow; font-style:italic; background-color:blue; padding:2px;");

ノート:CSSスタイルで多くの力を奨励します。 しかし、あなたは実験して、角質のように見えるものに驚嘆する必要があります。

コンソールでグループを使用する

Gecko 9.0(Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)が必要です

ドレッシング材を視覚的に組み合わせることで、プレゼンテーションの構成のためのグループの貢献を選択できます。 ブロックのネストを作成するには、console.group()を呼び出します。 console.groupCollapsed()メソッドも同様ですが、新しいfoldブロックが作成されるため、ボタンを押して開いて読み取ることができます。

ノート:焦げたグループはまだGeckoでは取り上げられていません。 groupCollapsed()メソッドはどれもgroup()のようには機能しません。

スレッドグループを終了するには、console.groupEnd()を呼び出すだけです。 お尻:

Console。log( "これは外部レベルです"); コンソールグループ(); console.log( "レベル2"); コンソールグループ(); console.log( "レベル3"); console.warn( "レベル3の詳細"); console.groupEnd(); console .log( "レベル2に戻る"); console.groupEnd(); console.debug( "外部レベルに戻る");

Visnovokは次のようになります。

タイマー

必要なGecko10.0(Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7)

Gecko 10の操作のタイミングを改善するために、コンソールオブジェクトにタイマートリムが導入されました。 タイマーを開始するには、console.time()関数を呼び出し、タイマーの名前をパラメーターとして渡します。 タイマーの名前に対してconsole.timeEnd()を呼び出して、時間をミリ秒単位で設定し、タイマーの名前パラメーターをパラメーターとして渡します。 一方で、1時間あたり最大10,000個のタイマーを実行できます。

例を見てみましょう:

Console.time( "回答時間"); alert( "クリックして続行"); console.timeEnd( "応答時間");

アラートウィンドウを閉じるのに必要な時間、次のコードをWebコンソールに書き込みます。

タイマー名は、開始時とタイマープロングの両方に表示されることに注意してください。

尊敬:これは重要です。トラフィックのタイミングを記録するためにタイマーを獲得すると、タイマーは操作の上位時間を表示します。その時間に、[Merezha]パネルに表示される時間は必要な時間未満です。ヘッダー用。 メッセージの本文の時間へのログ記録を有効にしている場合、タイトルと本文のメッセージの時間は、コンソールにログインする時間の責任を負います。

Trasuvannyaスタックviklik

コンソールは、スタックトレースの表示もサポートしています。 console.trace()を呼び出した瞬間まで、サイクルクリック関数のパス全体を示します。 たとえば、次のコードは次のとおりです。

Foo(); function foo()(function bar()(console.trace();)bar();)

コンソールへの表示は次のようになります。


尊敬

  • Firefoxから採用します。これは、Firefoxと同様に、サイドがコンソールオブジェクトをマップし、そのオブジェクトがコンソールオブジェクトを再マップすることを意味します。
  • Gecko 12.0より前は、コンソールオブジェクトのメソッドのみが機能し、Webコンソールパネルが開きました。 Gecko 12.0以降、WisnovokはDotiによってキャッシュされ、Docks Panel Web Consoleは表示されないため、表示されるはずです。
  • Vartoは、FirefoxのコンソールオブジェクトがFirebugプラグインが期待するオブジェクトそのものと混同されていることを示しています。
  • Webコンソール-FirefoxのWebコンソールプロセスのようにAPIコンソールWiki

今年の残りの期間には、jQueryやPrototype、JavaScriptなどのさまざまなライブラリが登場し、Webプロジェクトのスクリプトを作成するための中間のリーダーになりました。 このシンプルさの人気の高まりにより、Gmailなどの新しい追加機能が登場しました。Gmailは数千行のJavaScriptを置き換えることができ、小売業者の命令に応じて、vimogaをvolodinnyaіnstrumentarієmと同等に宣伝します。

プログラムの複雑さが増す結果として、リラックスのためのハードツールの存在が必要になります。これにより、恩赦を効果的に知ることができます。 追加機能の変更の値を簡単に確認できます alert()その関連性を失います。

この段階で、JavaScriptコードをより簡単なプロセスで改善するのに役立つ、小売業者の現在のツールの可能性について簡単に説明します。 Chromeブラウザの機能の主な点は、FireFox用のFirebugアドオンであり、関数の詳細については、DragonflyforOperaなどの他のツールで利用できます。

コンソール-見事な外観

小売業者向けのほとんどのプログラムには、プログラマーの親友としてコンソールがあります。 豊富なパネルは、恩赦、DOMリビジョン、JavaScriptコードの微調整、およびその他の非個人的なタスクについてのログ記録に勝利しています。 ブラウザの表示に応じて、コンソールはさまざまなコマンドによって呼び出されます(メニューから直接選択するため)。

  • ブラウザChromeおよびDragonflyforOpera-Ctrl + Shift + I
  • Firebug-F12

スクリプトの最後に表示されるように、コンソールはコードの恩赦を自動的に表示します。 ファイルと行は恩赦の順序で示され、恩赦でマウスボタンを押すと、恩赦への導入の焦点が移動します。

コンソールに表示されたダニ

コンソールがスクリプトコードに許しを表示する可能性は低くないかもしれません。 コンソールAPIとコマンドラインAPIを使用すると、コンソールからデータを表示できます。 最高のチームを探す 。ログ()。

コードの作成時間の下で、ロボットコードの正確さが逆転するように、変更の意味を知る必要があります。 究極の練習は最高の機能です alert()視覚的制御用。 ただし、このメソッドを使用すると、ダイアログボックスのプッシュボタンの前でコードが解決されなくなります。

最良の方法に対する最新のソリューション コンソールログ変更の値をコンソールパネルに表示するには:

Console.log( "キャプテンのログ"); //コンソールパネルに「キャプテンのログ」を表示します

メソッドをひねって計算値を表示することができます。

Function calcPhotos()(total_photos_diff = total_photos --prev_total_photos; //変更の値をコンソールに表示しますconsole.log(total_photos_diff);)

このようなアプローチの利点は、勝利した対話の方法と同じです。 alert()єコードを壊さないもの、そして小売業者は実際の時間の変化に対するデータの変化の価値を示すことができます。

Vart = 3、p = 1; function calcPhotos(total_photos、prev_total_photos)(var total_photos_diff = total_photos --prev_total_photos; //値をコンソールに出力console.log(total_photos_diff);//値を更新t= t * 1.3; p = p * 1.1;;(calcPhotos(t、 p);)、100);

ビジョンの記憶

ホバーされたアプリケーションの場合、ループはコンソールに多くの変更された値を表示します。 ただし、多くの場合、さまざまなデータを手動で視覚的に分離する必要があります。これにより、その月のコードで、敬意を高めることを効果的に確認できます。 Console APIでこれらのタスクを実行するには、いくつかの方法があります。

console.info():「情報」アイコンを表示し、情報をカラーで表示します。 デンマークの方法は、さまざまなポッドについて手動でvikoristovuvatimeproperdedzhennyaです。


console.warn():「前の」アイコンを表示し、情報をカラーで表示します。 境界のパラメータの逸脱に関する情報を手動でウィンクします。


console.error():「許し」アイコンを表示し、情報をカラーで表示します。 恩赦と批判的な心についての情報の提示のために手動でウィンクします。


注:Chromeリテーラーツールは、コンソールに情報を表示することはできません。

コンソールに情報を表示するためのさまざまな方法を選択すると、科学的な観測者にデータを送信できます。 情報の提出は、追加のヘルプのためにブロックに分割することができます。 勝利の方法 console.group() :

//最初のグループconsole.group( "写真計算"); console.info("合計の差は現在"+ total_photos_diff); console.log(total_photos_diff); console.groupEnd(); //別のグループconsole.group( "Incrementing variable"); console.log( "写真の総数は次のようになりました:" + t); console.log( "前の合計写真は次のようになりました:" + p); console.groupEnd();

このバットはコンソールに情報を収集します。 視覚的表現は、さまざまなブラウザで機能します。DragonflyforOperaのビューの下にある小さなビューです。


アプリケーションにカーソルを合わせると、コンソールAPIから使用可能なメソッドの小さなリストが表示されます。 Firebugの公式側で説明されているように、他にも多くの茶色の方法があります。

スクリプトのコースをオーバーライドする

コンソールで情報を表示するのは簡単な方法ですが、コードはさらに迅速かつ豊富な方法で変更できます。

アップグレードのプロセスを簡単にするために、データへのアクセスを使用して、メインポイントでコードの見出しを中断することができます。 その代わりに、再構築のポイントがあります。

ブレークポイントのあるPratsiyuemo

ブレークポイントを設定するには、[スクリプト]タブに移動し、リストから必要なスクリプトを選択します。 これで行だけになりました。スクリプトの実行を中断し、アクティブ化するために行番号のあるフィールドを押す必要があります。視覚的なインジケーターが表示されます。 次に、サイドを変更すると、タスクポイントでコードが壊れます。


ヴィコナニーが壊れた場合は、変化があるかどうかにマウスカーソルを置き、nalagojuvachを使用して、現在の瞬間の意味についてのヒントを与えることができます。

次に、背面パネルに表示できる追加の特別なボタンのコードに従うことができます。

リモートパネルでは、ローカルおよびグローバルな変更のダイナミクスを含め、コードを変更できます。

クリーンアップポイント

コードを洗練する過程で、心と歌う心のコードを改善する必要があります。 たとえば、スクリプトにサイクルがあり、その反復が50ミリ秒かかる場合、300回を超える反復が必要な場合は、皮膚の歯の後にバイキングのプロセスを開始するのは不器用です。 そのようなvipadkіvєumovnіrevivalnyaのために。


小さな女の子の場合、変数の値が total_photos_diff 200を超えることはありません。

マインドブレークポイントをアクティブにするには、ブレークポイントを右クリックし、[ブレークポイントの編集]を選択して[マインドブレークポイントの編集]ダイアログを開く必要があります。

コードにブレークポイントを設定する

ブラウザの小売業者インターフェイスを利用するために、手動でブレークポイントを設定しないでください。 特別なコマンドを使用して、コードからインストーラーを実行する方が簡単な場合があります。 以下に示すお尻では、歌う心の助けを借りてコードの入力を中断する方法が示されています。

If(total_photos_diff> 300)(デバッガー; //デバッガーを実行してコードを壊す)

コードを壊す他の方法

Krym vykoristannyaの書き直しのポイント、raznyhvipadkiのインストルメントrozrobniknadaєіnshіposobnostіzupinitivykonannyakoda。

DOMを変更するときのZupinka

DOMを変更する場合など、一部のコードを修正する必要がある場合、小売業者ツールを使用すると、DOMノードを変更するときにコードを修正できます。

HTMLコードパネルで、必要な要素上でマウスの右ボタンを押すと、DOMを変更するときにステップコード(属性の変更、ボタンの追加/削除、要素の削除)を選択できます。 コードにタグを付け直すと、要素を変更するときにコードが圧縮されます。

すべてのまたは壊れていないブドウの木の外観でズピンカ

小売業者のその他のツールを使用すると、ビネットの外観でスクリプトを編集できます。 Chromeでは、この機能は、インターフェースの最下行にある追加の「一時停止」アイコンの後ろに含めることができます。


あなたは、いくつかのvinyatkіvbudezupinkannyaコードのために選ぶことができます。 下に浮かんでいるお尻は、1つの未処理と1つの処理済み(try | catchブロック)スイッチを示しています。

Vart = 3、p = 1; function calcPhotos(total_photos、prev_total_photos)(var total_photos_diff = total_photos --prev_total_photos; //最初のグループconsole.info("合計の差は今"+ total_photos_diff);//値を更新t= t + 5; p = p +(total_photos_diff> 300 )(throw 0;)//拡散ビネットif(total_photos_diff> 200)(try($$( "#nonexistent-element")。hide();)catch(e)(console .error(e);))) setInterval(function()(calcPhotos(t、p);)、50);

wikiスタックの紹介

スクリプトの最後に恩赦が表示されるとすぐに、プログラムが恩赦を分析するのに役立つより多くのメソッドが説明されます。 エール、理解し始めないでください、それには理由があります。

スクリプトが中断された場合は、スクリプトが表示されている右側のパネルに敬意を払ってください 基本情報コールスタックの途中。

ウィキのスタックは、恩赦が現れてコードの一部が書かれた時点に至るまでの最新のパスを示しています。

下にホバリングした小さな子では、恩赦は関数によって直接生成されます 増分値()何がコードを歯にもたらしたのか。 小売業者ツールは、リンクの最新のスタックを表示します。これにより、潜在的に危険な領域を特定できます。


ヴィスノヴォク

このレッスンは、積極的に開発する予定の機器のより詳細なドキュメントの開始点です。

確認コンソールまたはブラウザのWebコンソールは、恩赦を表示し、哀悼の流れを理解し、奉献の時間のために他の豊富な目標を雑誌に与えるために、バイコリストと呼ばれます。 この情報へのアクセスは、機密オブジェクトを介して提供されます。

世界の時間-console.time()

console.time()を微調整して、コードのラップにかかる時間を決定できます。

%c形式で指定子をウィックできます。

  • Be-yaképіdstroyuvannyapravoruchvіd%cmaєvіdpovіdnyparameterimethodіdruk;
  • このパラメーターはemtpyの順序にすることができるため、順序の前にCSSルールをフリーズする必要はありません。
  • %c形式に2つの指定子がある場合、2番目と3番目のパラメーターで他のメソッドに割り当てられた独自のルールの母の1番目(%cに格納)と2番目の順序は正しいようです。
  • フォーマット指定子3%cが見つかった場合、サブストリング1、2、および3には独自のルールがあり、2番目、3番目、および4番目のパラメーターに割り当てられます。
コンソール。 log( "%cHello%cWorld%c !!"、//印刷される文字列 "color:blue;"、 //最初の部分文字列にカラーフォーマットを適用します"font-size:xx-large;" 、 //2番目の部分文字列にフォントフォーマットを適用します"/*CSSルールなし*/" //残りの部分文字列にルールを適用しません);

景色を見るためのWikoristannyaグループ

Visnovokは、攻撃的な方法で、コンソール内で加熱されたグループで識別および配置できます。

  • console.groupCollapsed():折りたたまれたレコードのグループを作成します。これは、展開ボタンを使用して展開でき、メソッドのクリック後にクリックされたすべてのレコードを表示します。
  • console.group():レコードの拡張グループを作成して、1週間後にそのメソッドにレコードを添付することを選択できるようにします。

次の方法を使用して、今後のレコードの識別を確認できます。

  • Console.groupEnd():スレッド化されたグループを終了し、メソッドの呼び出し後に親グループからの新しいエントリを処理できるようにします。

グループをカスケード接続して、同じ週末を振りかけたり、グループのスキンの真ん中にボールを選択したりすることができます。

ブラウザコンソールの友達

ブラウザコンソールは、他の単純な理由で微調整できます。 これは無効であるか、ブラウザで中断することなくWebコンソールを開くことができます(ほとんどのブラウザのF12キー-div。 ノート追加情報の選択については以下を参照)およびジャーナルの方法 Javascriptオブジェクト次のように入力すると、コンソールをクリックできます。

コンソール。 log( "マイメッセージ");

次に、[はじめに]を押すと、アップデートのコンソールのディスプレイにメッセージが表示されます。

console.log()は、ストリーミング領域で使用可能な引数の数に関係なく呼び出すことができます。 引数のデキルカは、それらの間に小さなギャップを置いて1行に並べられます。

var obj =(テスト:1); コンソール。 log(["string"]、1、obj、window);

logメソッドは、コンソールに進行状況を表示します。

["文字列"]1オブジェクト(テスト:1)ウィンドウ(/*切り捨て*/)

単純な行の場合、console.log()は、配列、オブジェクト、日付、関数などの他のタイプを処理できます。

コンソール。 log([0、3、32、 "文字列"]); コンソール。 log((key1: "value"、key2: "another value")); 配列[0、3、32、 "文字列"]オブジェクト(key1: "値"、key2: "別の値")

オブジェクトの添付ファイルを起動できます。

コンソール。 log((key1: "val"、key2:["one"、 "two"]、key3:(a:1、b:2))); Object(key1: "val"、key2:Array [2]、key3:Object)

Dateやfunctionのオブジェクトなど、一部のタイプはさまざまな方法で表示できます。

コンソール。 log(new Date(0)); コンソール。 log(function test(a、b)(return c;)); 1969年12月31日水曜日19:00:00GMT-0500(東部標準時)機能テスト(a、b)

その他の方法

犯罪方法ログ 最新のブラウザ同様の方法もサポートします。

    ホバーされた小さなものには、すべての関数が少しのタイムスタンプで表示されます。 Chromeバージョン 56.

    これらのメソッドはlogメソッドと同様に動作し、さまざまなコンソールで設定をさまざまな色または形式で表示できます。

    一部のnalagodzhuvachの場合、他のオブジェクトに関する情報は、テキストまたはオブジェクトの権限に基づく小さなtrikutnik()への圧力によって拡張できます。 崩壊するオブジェクトの力の値は、ジャーナルで公開または閉じることができます。 divに関するDodatkovu情報。 console.dirで

    確認後、一連の引数を指定できます。行または他のオブジェクトが存在する可能性があります。これは、その場合にのみ過大請求されるためです。これは誤りです。

    console.dirxml(object)オブジェクトのストリーム要素の別のXMLファイル(可能な場合)またはJavaScriptファイル(それ以外の場合)。 Viklik console.dirxml()for HTML要素およびconsole.log()と同等のXML。

    例えば:

    コンソール。 table(["Hello"、 "world"]);

    ショーショー:

    Var personArr = [( "personId":123、 "name": "Jhon"、 "city": "Melbourne"、 "phoneNo": "1234567890")、( "personId":124、 "name": "Amelia" 、"Location": "Sidney"、 "phoneNo": "1234567890")、( "personId":125、 "name": "Emil"、 "locity": "Perth"、 "phoneNo": "1234567890")( "PersonId":126、 "im": "Abraham"、 "loc": "Perth"、 "phoneNo": "1234567890")];

    Console.table(personArr、["name"、 "personId"]);

もう一度、私はあなたの敬意を表します、私たちはこれらの記事で何を見ることができますか ロボットコンソール他の拡張機能やブラウザでサポートされているものに関係なく、Firebaseでそれ自体。

Otzhe、穂軸についてはコンソールを知っています。 Firebaseには特別なタブがあります。


基本的な方法

Otzhe、それを書く方法を見てみましょう。 最初で最も単純なのはconsole.log()です。 この方法の助けを求めて、正面の小さな子供に「こんにちは、私はコンソールです」と書いた。 Firebugの許しを見た人たちは、別のメソッドの結果もチェックしました-console.error():


Tseメソッドはより多くを与える 詳細な情報記憶について。

console.logとconsole.errorが同じである場合、console.debug()、console.info()、およびconsole.warn()メソッドがあります。 コンソールでは、悪臭は次のようになります。


console.info()などのすべてのメソッドは、ファイル自体と行番号を表示し、destinksが呼び出されました。

指定されたオブジェクトメソッドのすべての属性を表示する素晴らしいconsole.dir()メソッドもあります。


また、console.dirxml()メソッドは、ドキュメントのXMLまたはHTMLノードに関するすべての情報を表示します。


観測時間のデータのグループ化

たとえば、ループで表示される場合など、コンソールに表示されるデータをグループ化する必要があると非難されることがよくあります。 そのためには、console.group()メソッドを使用してグループを開き、console.groupEnd()を使用してグループを閉じます。 あなたはこのように見えます。

©2022androidas.ru-Androidのすべて