Как я могу делать постоянные DOM-изменения с моим аддоном Firefox?

Question

Я пытаюсь написать свой первый аддон Firefox на данный момент. Цель довольно проста: я пытаюсь найти каждое вхождение определенного имени пользователя на веб-сайте и заменить его на строку. Я могу искать эти случаи вручную, поскольку их не так много. Это сработало для одного из вхождений в HTML-код веб-сайта, элемента, который имеет идентификатор и отображается в заголовке на каждом экземпляре веб-сайта:

<a href="/user/MyUserName" id="user-profile-name" class="head-link">MyUserName</a>

Вот как я заменил имя пользователя на String:

document.getElementById("user-profile-name").innerHTML = "The String";

Я пробовал этот и многие другие методы для других вхождений, у которых нет идентификаторов, в основном это классы:

<a href="/user/MyUsername" class="user um1">MyUserName</a>

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

var list = document.getElementsByClassName("um1");
for (i=0; i<list.length; i++) {
  list[i].innerHTML = "The String";
}

Как я могу сделать эти изменения постоянными? Изменение должно быть только визуальным, цель аддонов - скрыть имя пользователя.

Answer 1

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

var list = document.querySelectorAll("#user-profile-name,.um1");
for (i=0; i<list.length; i++) {
  list[i].innerHTML = "The String";
}