Как очистить консоль браузера

Обновлено: 02.07.2024

Мне было интересно, могу ли я прояснить консоль с помощью некоторой команды.

console.log() , можно распечатать. есть ли команда для очистки консоли.

Я попытался console.log(console); и получил следующие функции ниже.

[Думаю, нет возможности очистить консоль. но я хотел, чтобы кто-то сказал это мне. ]

ОТВЕТЫ

Ответ 1

Обновление: по состоянию на 6 ноября 2012 года console.clear() теперь доступен в Chrome Canary.

Если вы наберете clear() в консоли, он очистит его.

Я не думаю, что есть способ программно сделать это, поскольку это может быть неправильно использовано. (консоль очищается с некоторой веб-страницы, конечный пользователь не может получить доступ к информации об ошибке)

одно возможное обходное решение:

в типе консоли window.clear = clear , тогда вы сможете использовать clear в любом script на своей странице.

Ответ 2

Всегда хороший трюк:

Не самое изящное решение, я знаю:). но работает.

Для меня я обычно печатаю длинную разделительную строку "-----", чтобы облегчить чтение журналов.

Ответ 3

Кажется, что все работает отлично:

Ответ 4

Обратите внимание: я получил ошибку сразу после очистки консоли, поэтому она не отключает консоль, а только очищает ее. Кроме того, я только пробовал это в chrome, поэтому я не знаю, как он работает в кросс-браузере.

EDIT: Я тестировал это в Chrome, IE, Firefox и Opera. Он работает в консолях Chrome, MSIE и Opera по умолчанию, но не в Firefox, однако он работает в Firebug.

Ответ 5

Если вы хотите просто очистить консоль при отладке, вы можете просто нажать кнопку "ban-circle" ⃠ , чтобы очистить console.log.

Или просто нажмите "Ctrl + L" , чтобы очистить консоль с помощью клавиатуры.

Ответ 6

Вы можете создать свою собственную переменную, которая работает в обоих:

После этого вы можете просто использовать console.API.clear() .

Ответ 7

Press CTRL+L Ярлык для очистки log , даже если у вас есть отметка Preserve log .
Надеюсь это поможет.

Ответ 8

вы можете использовать

если вы работаете с кодировкой javascript.

иначе вы можете использовать CTR+L , чтобы очистить редактор косола.

Ответ 9

На Mac вы также можете использовать ⌘+K , как в терминале.

Ответ 10

Ответ 11

В консоли Chrome щелкните правой кнопкой мыши и у нас есть возможность очистить консоль.

Ответ 12

Вместо ввода команды просто нажмите:

очистить консоль хром

Ответ 13

Основываясь на ответе Cobbal, вот что я сделал:

В моем JavaScript я поставлю следующее:

Условный код не будет работать до тех пор, пока вы не установите ASSIGN window.clear(это означает, что ваш журнал пуст, пока вы это сделаете). В ТИПОВОЙ КОНСОЛИ DEBUG:

Mac OS 10.6.8 - Chrome 15.0.874.106

Ответ 14

Я использую следующее для псевдонима cls при отладке локально в Chrome (введите следующий код в консоли):

Теперь ввод cls в консоли очистит консоль.

Ответ 15

Chrome - нажмите CTRL + L , одновременно фокусируя входной сигнал консоли.

Firefox - clear() на вкладке консоли.

Internet Explorer - нажмите CTRL + L , одновременно фокусируя входной сигнал консоли.

Edge - нажмите CTRL + L , одновременно фокусируя входной сигнал консоли.

Ответ 16

Ответ 17

На MacOS:

Хром - CMD + K
Сафари - CMD + K
Firefox - нет ярлыка

В Linux:

В Windows:

Хром - CTRL + L
IE - CTRL + L
Край - CTRL + L
Firefox - нет ярлыков

В сценарии обновите метаданные значением //@include *://*/* , чтобы они запускались на всех страницах. Это будет работать только тогда, когда фокус находится на странице. Это просто обходной путь.

Ответ 18

Я думаю, что это больше не доступно из-за "проблем безопасности".

console.log(console) из кода дает:

С внешней стороны кода доступен _commandLineAPI. Вид раздражает, потому что иногда я хочу просто зарегистрировать и не видеть старый вывод.

Ответ 19

Я собираюсь добавить к этому, так как это поиск, вышедший на google..

При использовании ExtJS/Javascript я вставляю это, и консоль очищается - если нет ошибки..

Я, скорее всего, не согласен с курсом, но так я очищаю консоль для каждой загрузки/обновления страницы.

Как открыть Веб Консоль

Чтобы открыть Веб-консоль, выберите «Веб-консоль» в меню (Веб-)разработка в Меню Firefox (или меню Инструменты, если вы настроили показывать панель меню или вы работаете на Mac OS X), или нажмите её комбинацию клавиш Ctrl Shift K ( Command Option K в OS X).

Внизу окна браузера появится Набор инструментов с выбранной Веб-консолью (в Панели инструментов разработчика она называется просто «Консоль»):

По умолчанию консоль очищается каждый раз когда вы открываете новую страницу или перезагружает текущую. Чтобы переопределить это поведение, активируйте опцию "Enable persistent logs" в Настройках (en-US).

Прокрутка вниз показывает заголовки ответа . По умолчанию веб-консоль не записывает в журнал запрос и ответ тела : чтобы сделать это , войдите в контекстное меню веб-консоли и выберите " Log Request and Response Bodies ", перезагрузите страницу , а затем вы увидите их в окне " Inspect Network Request " .

Только первый мегабайт данных регистрируется для каждого запроса или ответа тела, поэтому очень большие запросы и ответы будут обрезаны .

JavaScript ошибки и предупреждения

JavaScript ошибки выглядят вот так:

Отправка-события

Веб-консоль также регистрирует события переформатированные в CSS категорию . Переформатирование это название операции, которой браузер вычисляет расположение части или всей страницы . Переформатирования происходят, когда изменение произошли на странице, чтобы браузер считал, что влияет на расположение . . Многие события могут вызвать переформатирование , в том числе : изменение размера окна браузера , активируя как псевдоклассы :hover, или манипулирование DOM в JavaScript.

Поскольку переформатирования могут быть дорогостоящими вычислениями и непосредственно влияют на пользовательский интерфейс , они могут иметь большое влияние на отзывчивость веб-сайта или веб-приложения . При переформатировании события веб-консоль может дать вам понять в какой момент оно начинает инициацию , как долго они принимаются к выполнению и , если есть переформатирования synchronous reflows сработавшие от JavaScript, то какой код вызвал их .

Если переформатирование является синхронным переформатированием , вызванным JavaScript , будет также показана ссылка на строку кода , инициировавшего переформатирование :

Нажмите на ссылку , чтобы открыть файл в Debugger.

Синхронные и асинхронные переформатирования

Если сделанное изменение аннулирует текущую схему - например, окно браузера изменяется или некоторые JavaScript изменяют CSS элемент - макет не пересчитывается немедленно. Вместо переформатирования в асинхронном режиме , в следующий раз браузер решает что это должно быть сделано (как правило , в следующий раз браузер перекрашивается ) . Таким образом, браузер может накопить коллекцию основанную на недействующих изменениях и пересчитать их эффект сразу .

Тем не менее , если какой-то JavaScript-код читает что стиль был изменён , то браузер должен выполнить синхронное переформатирование в порядке вычисленным расчётом стиля чтобы вернуться . Например , код как этот хочет вызвать немедленное , синхронное , переформатирование , когда вызовет window.getComputedStyle(thing).height :

Из-за этого, эта хорошая идея избежать чередования чтения и записи вызовов выше указанных основ стилей , когда воздействует DOM , потому что каждый раз, когда вы возвращаете стиль, который был недействительным в ранее вызванной записи , вы принуждаете к синхронному переформатированию .

Предупреждения безопасности и ошибки

Предупреждения безопасности и ошибки выглядят следующим образом :

Новое в Firefox 36

This site makes use of a SHA-1 Certificate; it's recommended you use certificates with signature algorithms that use hash functions stronger than SHA-1.

Сайт использует сертификат чья подпись использует алгоритм хеширования SHA-1 .

SHA- 1 по-прежнему до сих пор широко используется в сертификатах , но он начинает показывать свой возраст . Веб-сайтам и центрам сертификации рекомендуется перейти на более сильные хэш-алгоритмы в будущем . Смотрите Weak Signature Algorithm (en-US) статью рассказывающую подробнее.

Обратите внимание , что сертификат SHA- 1 не может быть собственным сертификат ом вашего сайта , но может свидетельствовать о принадлежности к сертификации, которая использовалась для подписи сертификата вашего сайта .

This section describes the Web Console output for those console API calls that actually result in output. For more general documentation on the console API, please refer to its documentation page.

From Firefox 40 onwards, the Web Console can display console messages from Shared Workers, Service Workers (en-US), and Chrome Workers. Check the relevant options in the Filtering dropdown menu to see them.

The argument to error() .

The console will display a full stack trace for errors:

If the assertion succeeds, nothing. If the assertion fails, the argument:

The console will display a full stack trace for assertions:

The argument to warn() .

The argument to info() .

The label supplied, if any, and the number of times this occurrence of count() has been called with the given label:

Listing of the object's properties:

The argument to log() .

Если аргумент — это узел DOM, консоль выдаст его в виде инспектируемого rich text:

Display tabular data as a table.

Notification that the specified timer started.

Duration for the specified timer.

Вы можете использовать console.group() для создания indented groups в выводе консоли. Смотрите Использование групп в консоли для более детальной информации.

Фильтрация и поиск

Фильтрация по типу

Фильтрация по тексту

Очистка содержимого

Интерпретатор командной строки

Вы можете выполнять JavaScript-код в реальном времени, используя командную строку в Web-консоли.

Ввод выражений

Для ввода выражений просто введите в командную строку и нажмите Enter . Для ввода выражений, состоящих из нескольких строк, используйте комбинацию Shift Enter вместо Enter .

Получение переменных

Вы можете получить доступ к переменным на странице; это могут быть как внутренние переменные например в объекте window , так и переменные, добавленные с помощью Javascript кода - например с помощью jQuery :

Автоподстановка

У командной строки есть функциональность автоподстановки: начните вводить несколько начальных букв - и появится всплывающее окно с возможными вариантами завершения команды:

Нажмите Enter или Tab , чтобы принять нужную подсказку, перемещайтесь вверх/вниз с помощью стрелок к другим вариантам подсказок или просто продолжайте набирать текст, если вам не подходит ни один из вариантов.

Консоль выдаёт подсказки из области видимости текущего активного фрейма. Это значит, что если вы уже достигли точки останова в функции, то у вас будут доступны автоподстановки только для объектов, которые находятся в одной области видимости с этой функцией.

Вы можете получать такие же подсказки для элементов массива:

Объявление переменных

Вы можете объявить ваши собственные переменные, и в последующем обращаться к ним:

История команд

Командная строка запоминает введённые ранее команды: чтобы перемещаться вперёд и назад по истории, используйте стрелки вниз и вверх на клавиатуре.

Начиная с Firefox 39, эта история сохраняется между сессиями. Чтобы очистить историю, используйте clearHistory() helper function.

Работа с iframes

Если страница содержит встроенные iframes (en-US), вы можете использовать команду cd() чтобы изменить область видимости в консоли на область определённого iframe, и после этого вы сможете выполнять функции, которые содержит объект document в этом iframe. Существует три способа выбрать iframe используя cd() :

Вы можете передать DOM-элемент для определённого iframe :

Вы можете передать CSS селектор для определённого iframe:

Вы можете передать глобальный объект Window для определённого iframe:

Для переключения контекста видимости обратно к окну верхнего уровня, введите cd() без аргументов:

Предположим у нас есть документ, который содержит iframe:

В этом iframe определена новая функция:

Вы можете переключиться на контекст iframe например так:

Сейчас вы сможете видеть, что глобальный объект Window это теперь наш iframe:

и сможете выполнить вызов функции, определённой в этом iframe:

Helper commands

Rich output for objects

When the Web console prints objects, it includes a richer set of information than just the object's name. In particular, it:

Type-specific rich output

The Web Console provides rich output for many object types, including the following:

Новое в Firefox 36

Examining object properties

When an object is logged to the console it appears in italics. Click on it, and you'll see a new panel appear containing details of the object:

To dismiss this panel press Esc ..

Выделение и инспектирование узлов DOM

If you hover the mouse over any DOM element in the console output, it's highlighted in the page:

In the screenshot above you'll also see a blue "target" icon next to the node in the console output: click it to switch to the Inspector with that node selected.

The split console

You can use the console alongside other tools. While you're in another tool in the Toolbox, just press Esc or press the "Toggle split console" button in the Toolbar (en-US). The toolbox will now appear split, with the original tool above and the web console underneath.

As usual, $0 works as a shorthand for the element currently selected in the Inspector:

When you use the split console with the debugger, the console's scope is the currently executing stack frame. So if you hit a breakpoint in a function, the scope will be the function's scope. You'll get autocomplete for objects defined in the function, and can easily modify them on the fly:

Клавиши быстрого вызова

Интерпретатор командной строки

Эти клавиатурные сокращения работают, пока вы находитесь в Интерпретаторе командной строки.

Команда	Windows	OS X	Linux
Прокрутить в начало вывода в консоль (новое в Firefox 34, и только при пустой командной строке)	Home	Home	Home
Прикрутить в конец вывода в консоль (новое в Firefox 34, и только при пустой командной строке)	End	End	End
Прокрутить вверх вывод консоли	Page up	Page up	Page up
Прокрутить вниз вывод консоли	Page down	Page down	Page down
Переместиться назад по истории команд	Up arrow	Up arrow	Up arrow
Переместиться вперёд по истории команд	Down arrow	Down arrow	Down arrow
Перейти в начало строки	Home	Ctrl + A	Ctrl + A
Перейти в конец строки	End	Ctrl + E	Ctrl + E
Выполнить текущее выражение	Enter	Enter	Enter
Добавить новую строку, чтобы войти в режим ввода многострочного выражения	Shift + Enter	Shift + Enter	Shift + Enter

Всплывающее окно автодополнения

Эти клавиатурные сокращения работают, когда открыто всплывающее окно автодополнения:

Команда	Windows	OS X	Linux
Выбрать текущее предложение в окне автодополнения	Tab	Tab	Tab
Закрыть окно автодополнения	Esc	Esc	Esc
Перейти к предыдущему предложению в окне автодополнения	вверх	вверх	вверх
Перейти к следующему предложению в окне автодополнения	вниз	вниз	вниз
Прокрутить вверх предложения в окне автодополнения	Page up	Page up	Page up
Прокрутить вниз предложения в окне автодополнения	Page down	Page down	Page down
Прокрутить в начало списка (новое в Firefox 34)	Home	Home	Home
Прокрутить в конец списка (новое в Firefox 34)	End	End	End

Global shortcuts

Эти сокращения работают для всех инструментов, находящихся в окне набора инструментов.

Консоль браузера — как Веб-консоль, но для работы со всем браузером, а не с отдельной его вкладкой.

Если вы хотите использовать и другие инструменты, доступные в обычном наборе инструментов веб-разработки, с кодом дополнений или браузера, вам может пригодиться Панель инструментов браузера (en-US).

В Консоли браузера можно также выполнять и выражения JavaScript. But while the Web Console executes code in the page window scope, the Browser Console executes them in the scope of the browser's chrome window. This means you can interact with all the browser's tabs using the gBrowser global, and even with the XUL used to specify the browser's user interface.

Открытие Консоли браузера

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

из меню: выбрать «Консоль браузера» из меню Разработка в меню Firefox (или меню Инструменты, если оно включено или на OS X)
с клавиатуры: нажать Ctrl+Shift+J (или Cmd+Shift+J на Mac).

Note that until Firefox 38, if the Browser Console has become hidden by a normal Firefox window and you select it again, either from the menu or from the keyboard, then it will be closed. From Firefox 38 onwards, this instead has the effect of switching the focus back to the Browser Console, which is more likely to be what you wanted.

You can also start the Browser Console by launching Firefox from the command line and passing the -jsconsole argument:

The Browser Console looks like this:

You can see that the Browser Console looks and behaves very much like the Web Console:

most of the window is occupied by a pane that display messages
at the top, a toolbar enables you to filter the messages that appear
at the bottom, a command line interpreter enables you to evaluate JavaScript expressions.

Browser Console logging

The Browser console logs the same sorts of messages as the Web Console:

However, it displays such messages from:

web content hosted by all browser tabs
the browser's own code
add-ons.

Messages from add-ons

The Browser Console displays messages logged by all Firefox add-ons.

Console.jsm

To use the console API from a traditional or bootstrapped add-on, get it from the Console module.

One exported symbol from Console.jsm is "console". Below is an example of how to acess it, which adds a message to the Browser Console.

HUDService

There is also the HUDService which allows access to the Browse Console. The module is available at Mozilla Cross-Reference. We see we can not only access the Browser Console but also Web Console.

Here is an example on how to clear the contents of the Browser console:

If you would like to access the content document of the Browser Console this can be done with the HUDService. This example here makes it so that when you mouse over the "Clear" button it will clear the Browser Console:

Bonus Features Available

For Add-on SDK add-ons, the console API is available automatically. Here's an example add-on that just logs an error when the user clicks a widget:

If you build this as an XPI file, then open the Browser Console, then open the XPI file in Firefox and install it, you'll see a widget labeled "Error!" in the Add-on bar:

Click the icon. You'll see output like this in the Browser Console:

For Add-on SDK-based add-ons only, the message is prefixed with the name of the add-on ("log-error"), making it easy to find all messages from this add-on using the "Filter output" search box. By default, only error messages are logged to the console, although you can change this in the browser's preferences.

Browser Console command line

From Firefox 30, the Browser Console command line is disabled by default. To enable it set the devtools.chrome.enabled preference to true in about:config, or set the "Enable chrome debugging" option in the developer tool settings.

Like the Web Console, the command line interpreter enables you to evaluate JavaScript expressions in real time:Also like the Web Console's command line interpreter, this command line supports autocomplete, history, and various keyboard shortcuts and helper commands. If the result of a command is an object, you can click on the object to see its details.

But while the Web Console executes code in the scope of the content window it's attached to, the browser console executes code in the scope of the chrome window of the browser. You can confirm this by evaluating window :

This means you can control the browser: opening, closing tabs and windows and changing the content that they host, and modify the browser's UI by creating, changing and removing XUL elements.

Controlling the browser

The command line interpreter gets access to the tabbrowser object, through the gBrowser global, and that enables you to control the browser through the command line. Try running this code in the Browser Console's command line (remember that to send multiple lines to the Browser Console, use Shift+Enter):

It adds a listener to the currently selected tab's load event that will eat the new page, then loads a new page.

Modifying the browser UI

Since the global window object is the browser's chrome window, you can also modify the browser's user interface. On Windows, the following code will add a new item to the browser's main menu:

On OS X, this similar code will add a new item to the "Tools" menu:

I was wondering if I could clear up the console with some command..

console.log() , can print. is there a command to clear up console.

I've tried to console.log(console); and got this functions below.

[ I guess there's no way to clear up the console. but I wanted someone to say it to me. ]

69.3k 16 16 gold badges 128 128 silver badges 173 173 bronze badges 62.1k 21 21 gold badges 117 117 silver badges 133 133 bronze badges

19 Answers 19

Update: console.clear() is available in all browsers

Update: As of November 6, 2012, console.clear() is now available in Chrome Canary.

If you type clear() into the console it clears it.

I don't think there is a way to programmatically do it, as it could be misused. (console is cleared by some web page, end user can't access error information)

one possible workaround:

in the console type window.clear = clear , then you'll be able to use clear in any script on your page.

67.6k 19 19 gold badges 137 137 silver badges 154 154 bronze badges console.clear() is now available in Chrome. Try it in Canary. You can simply hit CTRL+L while cursor is focused in the console. All console output will be wiped.

There's always the good ol' trick:

or a shorter variation of the above:

Not the most elegant solution, I know :) . but works.

For me, I usually just print a long "-----" separator line to help make the logs easier to read.

7,242 4 4 gold badges 19 19 silver badges 37 37 bronze badges 59.1k 24 24 gold badges 128 128 silver badges 160 160 bronze badges I would opt for the hard coded string, as it is more readable code. You can look at it for 1 second and know exactly what it does. And I guess there is a performance gain too.

This seems to work just fine:

If you use console.clear() , that seems to work in chrome. Note, it will output a "Console was cleared" message.

Note, I got an error right after clearing the console, so it doesn't disable the console, only clears it. Also, I have only tried this in chrome, so I dont know how cross-browser it is.

EDIT: I tested this in Chrome, IE, Firefox, and Opera. It works in Chrome, MSIE and Opera's default consoles, but not in Firefox's, however, it does work in Firebug.

Читайте также: