Hoy me paseé por la consola en Chrome en Facebook.
Sorprendentemente recibí este mensaje en la consola.
Ahora mi pregunta es:
¿Cómo es esto posible?
Sé que hay algunos métodos de 'explotación' para la consola, pero ¿cómo se puede hacer ese formato de fuente en la consola? (¿y es console.log?)
¿Cómo creo mensajes de registro de la consola javascript formateados?
Respuestas:
Sí, puede formatear el console.log()con algo como esto:
console.log("%cExtra Large Yellow Text with Red Background", "background: red; color: yellow; font-size: x-large");Tenga en cuenta lo que %cprecede al texto en el primer argumento y las especificaciones de estilo en el segundo argumento. El texto se verá como su ejemplo.
Consulte la "Salida de la consola de estilo con CSS" de Google o la Documentación de la consola de FireBug para obtener más detalles.
Los enlaces de documentación también incluyen algunos otros trucos interesantes, como incluir enlaces de objetos en un registro de consola.
Prueba esto:
console.log("%cThis will be formatted with blue text", "color: blue");Citando los documentos,
Utilice el especificador de formato% c para aplicar reglas CSS personalizadas a cualquier cadena que escriba en la consola con console.log () o métodos relacionados.
Hola votante negativo, ¿algún comentario para agregar? - Es difícil mejorar una respuesta (que crees que no es buena) cuando no dejas comentarios que te expliquen. :)
—
Blurfus
También puede formatear subcadenas.
var red = 'color:red';
var blue = 'color:blue';
console.log('%cHello %cWorld %cfoo %cbar', red, blue, red, blue);
Tenga en cuenta que solo es posible aplicar estilo dentro del primer argumento de
—
Qwerty
console.logy los estilos deben seguir inmediatamente.
console.log, ya que los navegadores más antiguos pueden detener su script con una excepción. caniuse dice que se introdujo en Firefox 9 y Edge 79; Chrome comenzó a admitirlo, evidentemente, algún tiempo antes de Chrome 83, pero no sabemos exactamente cuándo.