jQuery选择器没有生活在chrome控制台中

Question

当我输入我的javascript代码时,直到Chrome 22.0

console.debug($('.page'));

它过去常常返回我的谷歌Chrome控制台:

<div class="page"></div>

这是生活 DOM对象.我可以通过悬停它轻松找到我页面上的对象.昨天我将我的Chrome浏览器更新到版本23.0,现在相同的js代码返回类似的内容

[<div>, selector: ".page", context: #document]

这是原始的js对象.我可以扩展它并读取它的属性,但是没有可以在页面上看到的活 DOM对象.

我试图替换 console.debug用 console.log或添加 $('.page').get()到jQuery选择,但没有成功.

当我 console.debug($('.page'));直接写入Chrome控制台时,它也很有趣,就像在Chrome 22.0中一样.只有从js代码调试时才会出现问题.

Answer 1

理论上，这可以从 DOM 数组中去除 jQuery 属性：

console.log(Array.prototype.slice.call($('.page')));

但是，当控制台 DOM 节点数组时，开发工具栏将不再允许您从数组内浏览 DOM 节点（本机属性除外）。我知道解决这个问题的唯一方法是单独记录每个节点：

Array.prototype.slice.call($('.page')).forEach(function(elem) {
    console.log(elem);
});

或者简单地：

$('.page').each(function(i, elem) {
    console.log(elem);
});