最初にBaiduを開いてから、F12を押して開きます。コンソールアイテムでない場合は、コンソールアイテムをクリックして、コンソールで操作したいためです。 。
次の内容を参照してください。
さて、最初にコンテンツをクリアしましょう。右クリックしてクリアコンソールメニューを選択するか、Clear()を入力できます。
次に、document.getElementById( 'kw1');次に、Enterを押して、ID KW1を使用して要素情報を表示します。
とても簡単ではありませんか?次のステップは、Console.dirを使用して要素情報を表示することです。
console.dir(document.getElementbyId( 'kw1'));そして、Enterを押して、何か奇妙なものが出てきます。
このことをクリックすると、すべての属性メソッドが展開され、リストされます。簡単に言えば、これはこの要素のDOM属性メソッドです。
わかりました、私はこれについて詳しく説明しません。とにかく、DIRメソッドはデバッグツールの1つでもあります。
これらの質問は、実際には今日のコンテンツの予感です。コンソールで要素とその属性メソッドを表示する方法を見ました。
実際、コンソールは多くのコマンドラインAPIを提供します。簡単に言えば、コンソールのみが使用できる関数です。
現在、コンソールの方法とプロパティは次のとおりです。(Chrome 34)
コードコピーは次のとおりです。
["$$"、 "$ x"、 "dir"、 "dirxml"、 "keys"、 "values"、 "profileand"、 "monitorevents"、 "un monitorevents"、 "estect"、 "copy"、 "clear"、 "geteventlisteners"、 "geteventlisteners"、 "undebug"、 "" $ "" "$" "" "$" "" $ " 「$ 3」、「$ 4」、「$ _」]
PS:これらのことを見る方法については、後でそれらについて話します。私はあなたが当面にそれらを理解しないことを恐れています。
また、「コンソールオブジェクト#3。コマンドラインAPI」を参照して、その使用量の一部を確認することもできます。
よく使用するのは、$、$ _、$ 0- $ 4、dir、キー、値です。興味があるか、深く学びたい場合は、自分で資料を読んでください。
コードコピーは次のとおりです。
$ //それがdocument.queryselectorであることを理解するだけです。
$$ //それがdocument.queryselectorallであることを理解するだけです。
$ _ //は、前の式の値であり、コンソールオブジェクト#3です。コマンドラインAPIについて説明します。
$ 0- $ 4 //は、最後の5つの要素パネルで選択されたDOM要素であり、後で説明します。
dir //実際にはconsole.dirです
キー//オブジェクトのキー名を取得し、キー名で構成される配列を返します
値//オブジェクトの値を削除し、値の配列を返します
わかりました、説明から理解することは本当に難しくありませんが、それは以前に行われておらず、誰も何が起こるかを知りません。
Damn Baidu、それは実際にjQuery 1.10.2をロードしました。もともと、Baiduの環境はきれいで、これについて話す方が適切ですが、それは愚か者であることが判明しました。 。
説明するためにソソに着替えましょう。 。 http://www.soso.com/を開き、コンソールを開きます。
次に、$を使用して、IDクエリ(BaiduのKW1要素など)で要素を表示し、要素の属性メソッドを確認します。
以前と同じ機能ですが、コードは非常に簡単になりました。 $、dir、$ _の3つのコンソールプロパティとメソッドを使用すると、即座にデバッグが簡単になりますか?
一部の人々は、最近、jQueryが通常使用されていると言うかもしれませんが、これをチェックしたい場合はどうすればよいですか?
Baiduに戻って、今すぐ操作をしましょう。
$( '#kw1')ステップがjQueryオブジェクトを取得するため、今のところとは少し異なります。
実際の要素の属性メソッドを表示したい場合は、[0]を追加します
もちろん、JQueryオブジェクトを見たいだけなら、問題はありません。 。デバッグに関しては、もちろん調整中に試してみる必要があります。 。
実際、別の非常に簡単な方法があります。これは、左上隅の拡大ガラスアイコンをクリックして、入力ボックスを選択することです。
このようにして、0ドルを直接使用して表示できます。今、0ドルから4ドルを紹介しています。これが機能であり、簡単です。
キーと価値について簡単に説明しましょう。これは後で使用されます。 。しかし、一部の人々はまだそれを直接見るのが好きです。
コードコピーは次のとおりです。
var obj = {name: 'nima'、age:22、desc: 'silk one'};
私はあなたが一目でそれを理解し、一目でそれを理解できると信じています。
さて、今日のコンテンツはほぼすべてです。もちろん、私は自分で試してみる必要があります。そうでなければ、これらの知識ポイントを実際に学ぶことはできません。 。
私たちがそれを読むことができれば、私たちは皆、大学の入学試験のトップ得点者になりますよね?
最後に、私が以前に入力したコマンドを使用することです。再入力する必要はありません。矢印キーを上下に検索できます↑および↓。この機能はCMDに似ており、非常に便利です。 。
クラス後のエクササイズ:(現在、F12を直接押してコンソールを開きます)
1.記事の下のこの関数で推奨される関数ソースコードを確認します(もちろん、推奨事項をクリックできますが、私はあなたを止めませんでした。
2。関数が配置されているファイルの場所への位置。 (クライマックスが来ています)
3.関数を変更して無効にします。 (実際、それは単純なグローバルな変更とデバッグです。)
最後に、言われていることが間違っているか、理解できない場合、または進捗が追いつくことができない場合など、投稿して文句を言ってください。
また、何かを追加したり、実際のプロジェクトやプラグインをデバッグしたりする場合は、投稿することもできます。もちろん、それが非常に厄介なプロジェクトである場合、私はそれを紹介するために記事を書くことはできません。私は記事ではありません。 。 。