Provides the output of `console` methods into the document.
Provides the output of console methods into the document.
This is actually really easy to use!
1- Get either the minified/packed version or the plain version to study and change code,
2- Include the files in your HTML pages or copy-paste the code directly into your browser's console,
3- Add console._RELAY_TO_DOC = true; to your Javascript.
4- Use the console.log() on the way you intended!
5- You have finished all the steps to use the code!
No more opening the console! (but the output is still redirected there)
There are a few settings that you can use to change the functionality of your code.
console._RELAY_TO_DOC = true; or console._RELAY_TO_DOC = elem;
If an element is provided, the console messages will be placed in it.
If it simply is another truthy value, then the elements are added to document.
console._USE_JSON = true;
Enables or disables a simple JSON output. Nothing fancy will be shown: just what is returned by JSON.stringify().
console._SHOW_COOL_NUMBERS = true;
Shows the number in binary, octal and hexadecimal.
E.g.: 5 (0x5, 0o5, 0b101)
console._SHOW_TYPES = true;
Shows the datatype of a value
E.g.: (number) 5
console._SHOW_STRING_LENGTH = true;
Shows the length of a string
E.g.: "Test" (length: 4)
Remember, if you enable console._USE_JSON = true;, all the other options won't take effect. Except the 1st, obviously.
All the changes made will only be reflected on the next time you run console.log().
2 Useful methods are added to the console:
console._restore_old_method()
Restores any console to the value it was before running this code.
console._restore_relay_method()
Restores any console to the value it was after running this code.
It is really easy to write into the console:
Simply call console.log() and you are set!
It has nearly-identical to the native console output.
Also, this supports formatted strings (in a very basic form):
%s - Will parse the next argument as a string.%i or %d - Will parse the next argument as an integer.%f - Will parse the next argument as a floating-point number.%f.<size> - Non-standard Will parse the next argument as a floating number with <size> decimal digits.%c - Not supported
Using console.clear() will delete the messages that were added to the element/document.
This is enabled by default.
console methods:logerrorwarninfotimetimeEndclearAll the following methods work as expected.
Also, they display an icon to identify the message type.
This also catches uncaught errors and exceptions.
All credits due to the user @canon on http://meta.stackexchange.com/ for this functionality, on his awesome implementation
He was kind enough to let me use his code!
If you want, you can link directly to one of the following:
For that, just include the following code on your <head>
<script src="http://ismael-miguel.github.io/console-log-to-document/files/console.log.min.js"></script>