console.log() 不输出 jQuery 选择对象的 HTML [英] console.log() not outputting HTML of jQuery selection object

问题描述

在 Google Chrome 中使用 console.log 时遇到问题.突然，当我输出像 $(this) 这样的元素时，它的显示如下:

I got a problem when using console.log in Google Chrome. Suddenly when I was outputting a element like $(this) it was display like:

[<div>, context: <div>]

或

[jQuery.fn.jQuery.init[1]]

在控制台中.(两者都来自同一行:console.log($(this)))

in the console. ( Both came from the same row: console.log($(this)) )

这个问题昨天不知从何而来.代码没有问题.我在另一台计算机上记录了完全相同的内容，并且显示如下:

This problem arose yesterday from nowhere. There ain't a problem with the code. I logged the exact same thing on an other computer and there it is being displayed like:

[<div class='element'></div>, ...]

更新:新的Chrome版本改变了console.log()

Update: the new Chrome version changes the output of console.log()

有谁知道我如何才能恢复 Google Chrome 控制台的原始设置?

Does anyone know how I can get back to the original settings of Google Chrome console?

推荐答案

回答问题:

• 有谁知道我如何才能恢复 Google chrome 控制台的原始设置?

没有设置可以获取之前的 console.log() 输出.您可以:

There are no settings to get the former output of console.log(). You can either:

• 降级浏览器(使用旧版本的 chrome 或 铬基替代品)
• 通过添加您自己的 function log()
覆盖 console.log()
• 在某些情况下使用 outerHTML 或升级到 chrome 25.0.1323.1 (dev channel) where console.log($(#Selector)[0]);再次返回 outHMTL(见下文).

根据 user916276，console.log(jQuery-Object) 的输出发生了变化:

According to user916276 the output of console.log(jQuery-Object) has changed:

// output of console.log($jQuerObject) 
[<div class='element'></div>, ...] // in chrome <= 23
[<div>, context: <div>]            // in chrome 24

用户 brentonsrine 让我意识到我的 context.outerHTML 并不总是有效.

User brentonstrine made me aware of the fact that my context.outerHTML does not always work.

我用一个新示例更新了我的代码.似乎 jqObject.context.outerHTML 的存在取决于您如何将 jQuery-Object 传递给函数.我用 chrome dev channel (25.0.1323.1) 和两个基于铬的版本对其进行了测试(21, 22).

I updated my code with a new example. It seems that the existence of jqObject.context.outerHTML depends how you pass the jQuery-Object to the function. I tested it with chrome dev channel (25.0.1323.1) and two chromium based versions (21, 22).

console.log($(this)); // old chrome versions 
// new chrome version >23
// if you pass this to the function see my getThis(_this) function
console.log($(this).context.outerHTML); 
// if you use a jQuery selector
console.log($(this)[0]);   // at least in chrome build 25.0.1323.1

为了避免误解.这个答案是关于将 jQuery 对象写入 最近的 google chrome 浏览器(版本 24、25)的内置控制台.

To avoid misunderstandings. This answer is about the changed behaviour of writing a jQuery object to the inbuild console of the recent google chrome browsers (version 24, 25).

我查看了 chrome 源代码更改 在 Console.cpp 和 时间线视图 了解 WebInspector 的变化.我找不到导致 console.log() 行为变化的确切变化.我认为它与 更改有关到 ConsoleView.js，2，3.如果有人想启动 console.log() 返回与 Chrome 21、22 中相同的输出，他可以提交错误.这两个 bugs 可以用作模板来提出更改请求.

I took a look into the chrome source code changes at the Console.cpp and in the timeline view to find out about the changes in the WebInspector. I could not find the exact change that is responsible for the changed behaviour of console.log(). I assume that it has to do with changes to ConsoleView.js, 2, 3. If anyone would like to initiate that console.log() returns the same output as in Chrome 21, 22 he could file a bug. This two bugs could be used as a template to place the change request.

这篇关于console.log() 不输出 jQuery 选择对象的 HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！