En esta guía, se muestra cómo dar formato y aplicar estilos a los mensajes en la consola de las Herramientas para desarrolladores de Chrome. Consulta Comienza a usar los mensajes de registro para obtener información sobre cómo registrar mensajes en la consola.
En esta guía, se da por sentado que comprendes los aspectos básicos del desarrollo web, como cómo usar JavaScript para agregar interactividad a una página.
Cómo dar formato a los mensajes de la consola
Puedes usar los especificadores de formato para dar formato a los mensajes de la consola.
Los especificadores de formato comienzan con un carácter porcentual (%) y terminan con un "carácter de tipo" que indica el tipo de datos (número entero, número de punto flotante, etc.).
Por ejemplo:
- Abrir Console
Ingresa el siguiente comando de la consola.
const tools = 'Chrome DevTools'; console.warn('%s is awesome.', tools);El comando anterior produce el mensaje
Chrome DevTools is awesome..
Esta es la lista de especificadores de formato que admiten actualmente las Herramientas para desarrolladores de Chrome.
| Especificador | Salida |
|---|---|
%s |
Aplica formato al valor como una cadena |
%i o %d |
Establece el formato del valor como un número entero. |
%f |
Establece el formato del valor como un valor de punto flotante. |
%o |
Aplica formato al valor como un elemento DOM expandible. |
%O |
Da formato al valor como un objeto JavaScript expandible. |
%c |
Aplica reglas de diseño de CSS a la cadena de salida como se especifica en el segundo parámetro. |
Aplica varios especificadores de formato
Puedes usar más de un especificador de formato en un mensaje.
Ingresa el siguiente comando de la consola.
console.info('The total weight of %i %s and %d %s is %f grams.', 3, 'apples', 2, 'oranges', 432.4);El comando anterior produce el mensaje
The total weight of 3 apples and 2 oranges is 432.4 grams..