Изменения: отслеживайте изменения HTML, CSS и JavaScript.

София Емельянова
Sofia Emelianova

На вкладке «Изменения» отслеживайте изменения, которые вы вносите в:

На вкладке «Изменения» показаны изменения, внесенные вами в DevTools. Если вы перезагрузите DevTools или свою страницу, изменения исчезнут.

Чтобы DevTools сохранял изменения при загрузке страниц, выполните действия, описанные в разделе Локальные переопределения .

Чтобы DevTools записывал изменения в ваши локальные источники, выполните действия, описанные в разделе «Редактирование и сохранение файлов с помощью Workspaces» .

Откройте вкладку «Изменения»

Чтобы открыть вкладку «Изменения» :

  1. Откройте Инструменты разработчика .

  2. Нажмите Command + Shift + P (Mac) или Control + Shift + P (Windows, Linux, ChromeOS), чтобы открыть командное меню .

  3. Начните вводить changes , выберите « Показать изменения» и нажмите Enter .

    Запустите команду «Показать изменения».

Либо в правом верхнем углу нажмите кнопку Настраивайте и контролируйте DevTools > Дополнительные инструменты > Изменения .

Параметр «Изменения» находится в раскрывающемся списке «Дополнительные инструменты».

По умолчанию DevTools отображает вкладку «Изменения» в нижней части окна DevTools, в ящике .

Просмотр и понимание ваших изменений

Чтобы просмотреть изменения:

  1. Откройте Инструменты разработчика .
  2. Внесите изменения в исходники:

  3. Откройте вкладку «Изменения» и выберите файл в правой части вкладки.

  4. Обратите внимание на выходные diff , которые выделяют следующее:

Выделенные различия на вкладке «Изменения»

На вкладке «Изменения» вывод diff автоматически печатается, поэтому вам не нужно прокручивать по горизонтали, чтобы увидеть изменения в одной строке.

Скопировать изменения CSS

Если вы внесли изменения в CSS в разделе «Элементы» > «Стили» , вы можете скопировать их все одной кнопкой:

  1. Откройте вкладку «Изменения» и в правой части вкладки выберите файл CSS, в который вы внесли изменения.

    Копия.

  2. Нажмите кнопку Копия. Кнопка «Копировать» внизу вкладки «Изменения» .

Отменить все изменения, внесенные в файл

Чтобы отменить изменения, внесенные в файл:

  1. В левой части вкладки «Изменения» выберите файл с изменениями, которые нужно отменить.
  2. На панели действий внизу нажмите Отменить Отменить все изменения в текущем файле .

Кнопка возврата