Do you know how many methods there are on the console of the browser console?
This article will briefly introduce the consoles that you don't know and the consoles that I don't know
The most basic printing function, which everyone knows, will not be elaborated here
To print an error on the console, the syntax is as follows:
![]()
The following introduction is available on MDN:
Output a notification message to the web console. Only in Firefox, a small 'I' icon will appear next to the items in the logs of the web console
The grammar is as follows:
![]()
In actual testing, there will also be a small "I" icon in Safari browser, which is no different from console.log in Chrome browser
console.debug
Output debugging information to the console, only displayed when the console is configured to display debugging output (with Verbose checked on the browser's console filter), as shown below:
![]()
The syntax for printing a warning type message to the console is as follows:
![]()
Display the properties of a specified JavaScript object in the console and display them through an interactive list similar to a file tree style. The syntax is as follows:
![]()
Output an explicit XML/HTML element interaction tree including all descendant elements on the console. If the input parameter is not an XML/HTML element, it will be replaced in the form of a JavaScript object. Unlike console.dir, it outputs all descendant elements after it. As shown in the picture:
![]()
Print data in table format, with parameters as objects or arrays, and an optional parameter 'columns' to specify the columns to be displayed. See the above figure for the effect
![]()
![]()
When an array object has multiple attributes and only wants to display a portion, as shown in the following figure (with the gende rattribute hidden):
![]()
Clear all information on the current console
Console.count outputs the number of times it has been called, optionally passing in a label, and counting different labels separately
Console.countReset resets the current count, resets the default counter if no parameters are passed, and resets the counter for the corresponding label if a label is passed in
![]()
console.assert
Parameter is a value or expression
Assertion. If the result of the assertion content is true, nothing happens. If it is false, an assertion failure message is output to the console. Without passing any parameters, the assertion fails directly
Console.profile records performance information, optionally passing in a profile name
Console.fileEnd ends the recording of performance information, and can also optionally pass in a name; If a name is passed in, stop the record that passes in the name; otherwise, stop the most recent record
After recording, you can view it in the menu ->more tools ->JavaScript Profiler in the upper right corner of the console, as shown in the figure:
Start and end records:
![]()
View the final record:
![]()
Add a tag to the Performance (Chrome) or Waterfall (Firefox) tool of the browser. This allows you to associate a point in the code with other events that have been recorded on the timeline, such as layout events and drawing events.
You can choose to use a parameter as the timestamp tag, and then the tag will be displayed next to it.