Как изменить чужую HTML страницу через консоль, чтобы изменения сохранялись?

Question

[PANOV_DEV]

Как можно с помощью JavaScript изменить какой-то блок или добавить новый блок, но после перезагрузки страницы, чтобы оно не изменилось?

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

P.S. На чужом сайте. Через консоль.

Comments

[Сергей Кузнецов]

Например создать собственный Userscript и менять им страницу как вам хочется.
Учимся писать юзерскрипты.

Answer 1

[Максим К]

Написать плагин для хрома, Фокса и делать что на странице по типу templemonkey

Answer 2

[AUser0]

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

Answer 3

[Vlad]

Ну, как вариант(точнее костыль) можно создать iframe на весь экран, убрать границы и следить за фреймом. При загрузке новой страницы добавлять свой скрипт/код и менять адрес на панели(если нужно).

Но он будет постоянно применять изменения заново, а не сохранять.

Как то так:

var ifrm = document.createElement("iframe"); // Создаём фрейм
ifrm.setAttribute("src", window.location.href);

ifrm.style.width = "100vw"; //Растягиваем на весь экран
ifrm.style.height = "100vh";
ifrm.setAttribute('frameborder', 0); // Убираем "бордюр"

document.body.innerHTML = "";
document.body.appendChild(ifrm);

ifrm.onload = function() { // Следим за перезагрузкой страницы

    // Меняем заголовок и историю (если нужно)
    var ttl = ifrm.contentDocument.querySelector('head title').innerText;
    document.title = ttl;
    var pth = ifrm.contentWindow.location.href;
    window.history.replaceState({}, ttl, pth);

    // Первый вариант (Подгружать скрипт по ссылке)
    var script1 = document.createElement("script");
    script1.src = "https://evil.corp/code.js";
    script1.type = "text/javascript";
    ifrm.contentWindow.document.getElementsByTagName("body")[0].appendChild(script1);

    // Второй вариант (Вставка тега с кодом)
    var script2 = document.createElement('script');
    var inlineCode = document.createTextNode("alert('вместо алерта код')");
    script2.appendChild(inlineCode);
    ifrm.contentWindow.document.getElementsByTagName("body")[0].appendChild(script2);
};