Как создать отформатированные сообщения журнала консоли javascript

Теперь я перешел на консоль в Chrome на Facebook.

Удивительно, но я получил это сообщение в консоли.

Теперь мой вопрос:
Как это возможно?
Я знаю, что для консоли есть несколько "эксплойтных" методов, но как вы можете сделать такое форматирование шрифта в консоли? (и это console.log?)

Ответ 1

Да, вы можете отформатировать console.log() примерно так:

console.log("%cExtra Large Yellow Text with Red Background", "background: red; color: yellow; font-size: x-large");

Обратите внимание на %c перед текстом в первом аргументе и спецификациями стиля во втором аргументе. Текст будет выглядеть как ваш пример.

См. Google "Стилизация коннекторов с помощью CSS" или FireBug Консольная документация для более подробной информации.

Ссылки на документацию также включают некоторые другие аккуратные трюки, такие как включение ссылок объектов в журнал консоли.

Ответ 2

Попробуйте следующее:

console.log("%cThis will be formatted with blue text", "color: blue");

Цитирование документов,

Вы используете спецификатор формата% c для применения пользовательских правил CSS к любому строка, которую вы пишете в консоли с помощью console.log() или связанного с ней Методы.

Источник: https://developers.google.com/web/tools/chrome-devtools/console/console-write#styling_console_output_with_css

Ответ 3

Вы также можете отформатировать подстроки.

var red = 'color:red';
var blue = 'color:blue';
console.log('%cHello %cWorld %cfoo %cbar', red, blue, red, blue);

Ответ 4

На веб-сайте Google: сайт

console.log("%cThis will be formatted with large, blue text", "color: blue; font-size: x-large");