Веб-сторінки - це лише документи, які відображає ваш веб-браузер. Але що, якби ви могли ввести безпосередньо на будь-якій веб-сторінці, щоб змінити її? Ви можете, і вам не потрібно розширення браузера - це функція, вбудована в кожен сучасний браузер.
Ця функція використовує перевагу функції „document.designMode”, яку ви можете ввімкнути через консоль JavaScript веб-браузера. Нещодавно це було висвітлено Томеком Сулковським у Twitter, але це настільки круто, що ми маємо поділитися ним із нашими читачами.
Це відчуття, коли ви вперше виявили `document.designMode` pic.twitter.com/bxA1otzCjN
- Томек Сулковскі (@sulco) 27 вересня 2019 р
Ви можете використовувати цю функцію для очистіть веб-сторінку перед її друком , перевірити, як виглядатимуть зміни на веб-сторінці, або навіть просто жартувати людей. Це буде подібно редагуванню документа 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 = 'вимкнено'
Веб-сторінку більше не можна редагувати, але ваші зміни зберігатимуться до наступного оновлення сторінки.