Как редактировать любую веб-страницу в Chrome (или любом браузере)

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

Эта функция использует преимущества функции «document.designMode», которую вы можете включить через консоль JavaScript вашего веб-браузера. Недавно Томек Сулковски отметил это в Твиттере, но это настолько круто, что мы должны поделиться им с нашими читателями.

Вы можете использовать эту функцию, чтобы очистить веб-страницу перед ее печатью, проверить, как будут выглядеть изменения на веб-странице, или даже просто подшутить над людьми. Это будет похоже на редактирование документа Word - возиться с HTML не требуется.

Чтобы активировать эту функцию, посетите веб-страницу, а затем откройте консоль разработчика. Чтобы открыть консоль в Google Chrome, нажмите меню> Дополнительные инструменты> Инструменты разработчика или нажмите Ctrl + Shift + i.

Хотя мы используем здесь в качестве примера Chrome, эта функция работает и в других современных браузерах. Вот как открыть консоль в других браузерах:

  • В Mozilla Firefox щелкните меню> Веб-разработчик> Веб-консоль или нажмите Ctrl + Shift + K.
  • В Apple Safari нажмите Safari> Настройки> Дополнительно и включите «Показывать меню разработки в строке меню». Затем нажмите «Разработка»> «Показать консоль JavaScript».
  • В Microsoft Edge щелкните меню> Дополнительные инструменты> Инструменты разработчика или нажмите F12, а затем перейдите на вкладку «Консоль».

Щелкните вкладку «Консоль» в верхней части панели инструментов разработчика. Введите в консоль следующее и нажмите Enter:

document.designMode = 'на'

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

Это просто меняет внешний вид веб-страницы в вашем браузере. Как только вы обновите страницу, вы снова увидите оригинал. Если вы перейдете на другую веб-страницу или вкладку, она не перейдет в режим дизайна, пока вы не откроете консоль и не наберете эту строку еще раз.

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

document.designMode = 'выкл'

Веб-страница больше не будет доступна для редактирования, но ваши изменения будут сохранены до следующего обновления страницы.