Как запустить контент скрипт после ajax обновления страницы

@Lerto · Регистрация: 26.10.2020

Студворк — интернет-сервис помощи студентам

У меня есть расширение, нажимающее на кнопки, и есть сайт, в котором страницы обновляются, как я понял, через ajax (url меняется, меняется содержимое, но вкладка не обновляется), и мой контент скрипт не запускается после такого обновления (запускается, если обновить вкладку). Как запустить контент скрипт после этого обновления и загрузки всей страницы?

@diadiavova · 26.11.2020, 12:40

Lerto, судя по всему речь идет об одностраничном приложении (SPA) и там отследить изменения в адресной строке не так просто. Но вот на SO есть такой вопрос javascript - Event when window.location.href changes - Stack Overflow
Вот этот ответ вполне рабочий(проверено)

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
var oldHref = document.location.href;
 
window.onload = function() {
 
    var
         bodyList = document.querySelector("body")
 
        ,observer = new MutationObserver(function(mutations) {
 
            mutations.forEach(function(mutation) {
 
                if (oldHref != document.location.href) {
 
                    oldHref = document.location.href;
 
                    /* Changed ! your code here */
 
                }
 
            });
 
        });
 
    var config = {
        childList: true,
        subtree: true
    };
 
    observer.observe(bodyList, config);
 
};

код своего скрипта надо вставить туда где написано /* Changed ! your code here */

@Lerto · 26.11.2020, 12:52 **[ТС]**

В пример приведу гитхаб, переход по разделам репозитория происходит без обновления вкладки https://github.com/apex/log

@diadiavova · 26.11.2020, 12:56

Сообщение от Lerto

В пример приведу

А зачем пример? Не сработало что ли?

Добавлено через 1 минуту
Lerto, проверил на этом примере. Все работает.

@Lerto · 26.11.2020, 13:07 **[ТС]**

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

@diadiavova · 26.11.2020, 13:38

Lerto, можно таймаут поставить, там от начала до конца загрузки времени не ного пройдёт.

@Lerto · 26.11.2020, 13:40 **[ТС]**

Там страница может грузиться секунду, а может и 5 секунд, таймаут не очень подойдет, можно это как-нибудь по другому сделать?

@diadiavova · 26.11.2020, 15:00

Сообщение от Lerto

Там страница может грузиться секунду, а может и 5 секунд, таймаут не очень подойдет, можно это как-нибудь по другому сделать?

Ну вообще, по идее, если контент уже начал прорисовываться на странице (а отслеживается именно это), то он все-таки уже загружен и нужно только дождаться завершения вставки его в на страницу. Это не должно занять много времени. Другой вопрос - если для завершения формирования страницы отправляется несколько запросов на сервер и нужно дождаться завершения их всех. Но тут браузер уже не сможет определить, какой именно момент нужно считать окончанием загрузки, так что ожидать, что у него есть какое-то событие типа DOMContentLoaded для такого случая не следует. Тут опять-таки придется отслеживать изменения на странице и уже самостоятельно решать когда процесс можно считать завершенным и я думаю, что для каждой конкретной страницы этот момент будет определяться по-разному.
Собственно приведенное выше решение тоже основано на отслеживании изменений, то есть, если на странице произошло изменение, то проверяется изменился ли адрес. Код нужно дополнить для случаев, когда адрес не меняется, но меняется что-то на странице и тут для каждой конкретной страницы нужно проверять, загрузился ли какой-то элемент, находящийся ниже того, с чем ты собираешься работать и, в случае положительного ответа, вызывать свой скрипт. Естественно, придется добавить какие-то флаги, чтобы быть уверенным, что обработка происходит только один раз и т. д. Это все сложновато, но, как мне кажется, вполне реализуемо.

Новые блоги и статьи Все статьи Все блоги /
Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .	Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .	Использование значений реквизитов справочника в документе, с определенными условиями и правами Maks 07.04.2026 1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .

@Lerto 0 / 0 / 0 Регистрация: 26.10.2020 Сообщений: 15

	Chrome Extension Как запустить контент скрипт после ajax обновления страницы 26.11.2020, 01:21. Показов 3612. Ответов 7 Метки extension, javascript (Все метки) У меня есть расширение, нажимающее на кнопки, и есть сайт, в котором страницы обновляются, как я понял, через ajax (url меняется, меняется содержимое, но вкладка не обновляется), и мой контент скрипт не запускается после такого обновления (запускается, если обновить вкладку). Как запустить контент скрипт после этого обновления и загрузки всей страницы? 0

@Lerto 0 / 0 / 0 Регистрация: 26.10.2020 Сообщений: 15
	26.11.2020, 12:52 [ТС]
	В пример приведу гитхаб, переход по разделам репозитория происходит без обновления вкладки https://github.com/apex/log 0

@Lerto 0 / 0 / 0 Регистрация: 26.10.2020 Сообщений: 15
	26.11.2020, 13:07 [ТС]
	Спасибо большое, работает, только скрипт запускается до загрузки всей страницы, сразу после перехода. 0

@diadiavova 7261 / 2608 / 745 Регистрация: 11.04.2015 Сообщений: 4,155 Записей в блоге: 43
	26.11.2020, 13:38
	Lerto, можно таймаут поставить, там от начала до конца загрузки времени не ного пройдёт. 0

@Lerto 0 / 0 / 0 Регистрация: 26.10.2020 Сообщений: 15
	26.11.2020, 13:40 [ТС]
	Там страница может грузиться секунду, а может и 5 секунд, таймаут не очень подойдет, можно это как-нибудь по другому сделать? 0

Как запустить контент скрипт после ajax обновления страницы

Решение