Почему у 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);