8

Chrome 24 には、 でオブジェクトを出力する新しい方法がありますconsole.log()

たとえば、この jsFiddleconsole.log($("p"));の例では、次の狂気が出力されます。

▼[<p>, <p>, <p>, prevObject: jQuery.fn.jQuery.init[1], context: #document, selector: "p"]
  ► 0: <p>
  ► 1: <p>
  ► 2: <p>
  ► context: #document
    length: 3
  ► prevObject: jQuery.fn.jQuery.init[1]
    selector: "p"
  ► __proto__: Object[0]

DOM 要素のコレクションが先頭に配置されていることがわかります。しかし、ほとんど空の単純なタグでさえ展開しようとすると、<p>あなたのいたるところに投げ出されます:

▼ 0: <p>
   accessKey: ""
   align: ""
 ► attributes: NamedNodeMap
  ...
  [stopping here for sanity's sake]

では、このすべての情報をどのように使用すればよいでしょうか。私の最初の本能は、それを以前のように飼いならすことですが、よく考えてみると、アクセスしたいと思うかもしれない情報が本当にたくさんあります。しかし、私は自分が見ているものを理解するのに苦労しています。その多くは jQuery 値のように見えます。これは、オブジェクトが持っている (または持っていない) すべての jQuery 値のリストですか?

► context:それから、物と物の全体の問題があり► __proto__:ます。ドリルダウンを開始すると、__proto__停止することはありません。無限に落ちると思います!

この新しい出力の使用方法を学び始めるにはどうすればよいですか?

編集: 実際、まだ Chrome 23 を使用していることに気付きました。これは 24 で導入されたものではありません。このスレッドの誰かが、これは Chrome 24 の問題だと言いましたが、23 で新しくなったのでしょうか? いずれにせよ、私はつい最近、jQuery オブジェクトでこれに気付き始めたばかりです。

EDIT 2:古い方法でログを記録する方法を探しているだけなら、これを試してください:(帽子のヒント

 console.log.apply(console, $("div"));
4

3 に答える 3

2

デモ フィドルでは、NodeLists または HTMLCollections をログに記録しています。NodeList 内の各要素は、数値インデックス 0、1、2 などで表されます。要素が存在する場合、0 は NodeList の最初の要素です。

要素を展開すると、DOM Core 3 仕様で定義されている HTML 要素の使用可能なすべてのプロパティが表示されます。このhttp://domenlightenment.com/#3.2の詳細については、こちらを参照してください。すべてのプロパティとその目的のリストについては、https ://developer.mozilla.org/en-US/docs/DOM/element を参照してください。これは Chrome の新しい機能ではありません。

最新の Chrome バージョンの新機能は、最上位のログ オブジェクトであるため、コンソールを開いて次のように入力したとします。

console.log(window)

私がやったばかりのとき、ログに記録するときに展開されたウィンドウオブジェクトが提供するもののプレビューをログに記録しました。たとえば、次のように表示されます。

Window {is_minor: 5, bmi_ie6: false, careers_adselector: "div.hireme, div#hireme"...}

リストの要素の下にリストされているその他の NodeLists プロパティ:

フィドルを少し変更しました。コンソールhttp://jsfiddle.net/jaredwilli/H3YWq/2/を表示すると、オブジェクトのプレビューが表示されるはずです

これらのものを実際に取り除くことはできません。それらはDOMの一部であり、常に存在します。そうしないと、見ているもののNodeTypeがElementNode以外のものになります。

于 2012-11-23T18:50:11.393 に答える
0

最初の要素が必要なので、[0]を使用します

別のオプションとして、FirefoxのFirebugをチェックしてください。私もChromeが大好きで、毎日使用していますが、Firebugは優れたプラグインであり、問​​題が発生したことはありません。

于 2012-11-26T04:42:57.753 に答える
0

私はあなたと同じようにこの変化に腹を立てています。これが理想的ではないことは承知していますが、少しでもお役に立てれば幸いです。

console.log($('p')[0]);

以前にその解決策を見たことがあるかもしれませんが、たとえばループに陥った場合は機能しないことがわかりました。

$('p').each(function(){
 console.log($(this)[0]);
});

それはあなたが慣れている結果をあなたに与えることにはならないので、私はこのよう['context']に代わりに使用しなければなりませんでし[0]た:

$('p').each(function(){
 console.log($(this)['context']);
});

繰り返しますが、私は自分でより良い解決策を探していますが、見つけたものをあなたと共有したいと思いました.

于 2012-11-21T05:31:19.247 に答える