Почему у Google Chrome есть другой вывод console.log() через jQuery?

Когда я консолью регистрирую объект jquery, например.

var s = $("#item");
console.log(s);

Я получаю что-то вроде этого

[div#item, context: document, selector: "#item", jquery: "1.9.1", constructor: function, init: function…]

Я помню раньше (месяц назад или около того), я бы получил что-то вроде:

 [<div id="item">pas</div>]

Это изменение в самом Chrome? Или произошло изменение jquery? Или я действительно сделал что-то, чтобы результат выглядел по-другому.

Я нахожу этот второй вывод намного проще для чтения, и я могу нависнуть над этим и помечать его на странице. Теперь я получаю слишком много информации, которую довольно трудно читать

Ответ 1

Я думаю, что вы заметили разницу между оценкой объекта jQuery в консоли и отображением его с помощью console.log(). Используя David Thomas fiddle, установите точку останова в инструкции console.log. Когда он остановится в точке останова, введите $s в консоль, и вы увидите

[<div id="item">pas</div>]

Затем продолжите, и вы увидите подробный объект, напечатанный console.log().

Я не совсем уверен, что делает jQuery или Chrome, что вызывает эту разницу. Результат при вводе $s, по-видимому, является результатом $s.toArray(), а console.log() показывает реальный объект jQuery.

Еще одно доказательство того, что это не новое поведение - я только что связал дублирующий вопрос с ноября.

Ответ 2

var s = $("#item").html();
console.log(s)

Ответ 3

попробовать...

var s = $("<div>").append($("#item").clone()).html();

console.log(s);

$(s).remove();

Это не в самой красивой форме, но результат - то, что вы ищете, и я уверен, что вы могли бы придумать хорошую функцию для него...

В основном я создаю div, помещая в него копию #item и извергая div innerHTML на консоль, чтобы показать весь элемент #item. (Не только #item innerHTML) Затем я уничтожаю s для очистки.

Ответ 4

Да, может быть изменение с jquery, проверьте, как они теперь работают с dom-объектами в версии 1.9.1

http://jsfiddle.net/5HJ3L/1/

если вы попробуете console.log таким образом

var s = $("#item");
console.log(s);

вывод будет похож на

[div#item, context: document, selector: "#item", jquery: "1.9.1", constructor: function, init: function…]
0: div#item
context: document
length: 1
selector: "#item"
__proto__: Object[0]

если вы проверите его внимательно, вы найдете требуемый вывод в указанном выше массиве в ключе 0, поэтому вывод для следующей строки будет

console.log(s[0]);

Вывод:

<div id="item">pas</div>

также, если вы попробуете его без jquery, вы получите тот, который вам нужен

var e = document.getElementById('item');
console.log(e);

Вывод:

<div id="item">pas</div>

PS: это не предложение против jquery, а чтобы показать, как они будут действовать google-chrome

Исправление: Также обратите внимание, что упоминание о выпуске в вопросе находится в форме array, тогда как способы, которые я предложил, находятся в string

Ответ 5

Я получил ожидаемый результат для консоли, отправляющей элемент DOM, а не jquery.

console.log($("div")[0])

Ответ 6

Вы можете управлять стилем вывода вывода журнала консоли с помощью c style console.log: https://developers.google.com/web/tools/chrome-devtools/console/console-write#styling_console_output_with_css

Например, чтобы выставить простой стиль элемента dom:

console.log("%o", document.body)

Ответ 7

    if div value printed on div .. then plz menstion html(). 

    var s = $("#item").html();

    console.log(s);