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:log
error
warn
info
time
timeEnd
clear
All 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>