如何使用Chrome的新`console.log()`输出？

Question

Chrome 24有一种新的输出对象的方式console.log().

例如,console.log($("p"));在这个jsFiddle例子中输出这种疯狂:

?[<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对象上注意到这一点.

编辑2:如果你只是想找到如何记录旧方法,试试这个:( 帽子提示)

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

Answer 1

我和你一样对这一变化感到恼火。我知道这并不理想，但希望对您有所帮助。

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

您之前可能已经见过该解决方案，然后发现如果您处于循环中则它不起作用：

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

这最终不会给你你习惯的结果，所以我不得不使用而['context']不是像[0]这样：

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

同样，我自己也在寻找更好的解决方案，但我想我应该与您分享我发现的内容。