console.log() not outputting HTML of jQuery selection object
console, google-chrome, javascript
Solution
To answer the question:
- Does anyone know how I can get back to the original settings of Google chrome console?
There are no settings to get the former output of console.log(). You can either:
- downgrade the browser (use an older version of chrome or chromium based alternatives)
- overwrite `console.log()` by adding your own `function log()`
- use outerHTML in some cases or upgrade to chrome 25.0.1323.1 (dev channel) where console.log($(#Selector)[0]); returns outHMTL again (see below).
Chrome 23/24: Output of console.log() changed sometimes
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
User brentonstrine made me aware of the fact that my context.outerHTML does not always work.
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
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 source code
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.
Problem
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>] ``` or ``` [jQuery.fn.jQuery.init[1]] ``` 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>, ...] ``` Update: the new Chrome version changes the output of `console.log()` Does anyone know how I can get back to the original settings of Google Chrome console?