Селекторы jQuery, не живущие в хром-консоли

До Chrome 22.0, когда я вставляю код javascript

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

он возвращался на консоль Google 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-кода.

Ответ 1

Теоретически это может работать для выделения свойств jQuery из массива DOM:

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

НО, при утечке массива узлов DOM панель инструментов dev больше не позволит вам просматривать узлы DOM из массива (кроме собственных свойств). Единственное, что я знаю, чтобы обойти это, - это зарегистрировать каждый node индивидуально:

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

Или просто:

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

Ответ 2

Иногда для отладки я тестирую также ".html()" или innerHtml, чтобы отлаживать некоторый код HTML на лету, но способ "Давид" тоже то, что я сделал.

Ответ 3

Это, по-видимому, исправлено в версии 23.0.1271.91.