Я делаю плагин для сайта, где я могу использовать только javascript. Я хочу выполнить код, когда элемент il с id = «gridview» больше не имеет «скрытого» класса. Спасибо за помощь.
Я уже пробовал:
document.getElementById("id = "eval_grid_tab"").addEventListener("click", start);
это html
<li id = "eval_grid_tab"><a href = "#gridview">Tabel</a></li>
<div id = "gridview" class = "rightsPanel smscTabsPanel hidden" style = "height: 795px;">...</div>
@Cully Когда я нажимаю на элемент a, класс «скрытый» удаляется, но я не могу изменить HTML-код здесь, поэтому мне нужно делать все с помощью js
Вы сказали, что хотите написать плагин. Вы имеете в виду плагин для браузера или скрипт Greasemonkey? Потому что в таких случаях я думаю, что вы ищете MutationObserver.
Я делаю плагин со скриптом Tampermonkey.
Тогда да, MutationObserver — это то, что вам нужно :)
Dankje вел! @айскуб!
Для этого вам нужно использовать MutationObserver. Он отслеживает изменения DOM (например, удаление/добавление классов) и запускает функцию обратного вызова, которую вы можете использовать так, как считаете нужным.
// Select the node that will be observed for mutations
var targetNode = document.getElementById('gridview');
// Options for the observer (which mutations to observe)
var config = { attributes: true };
// Callback function to execute when mutations are observed
var callback = function(mutationsList, observer) {
for(var mutation of mutationsList) {
if (mutation.type == 'attributes') {
// Triggers when an attribute like 'class' is modified
console.info('The ' + mutation.attributeName + ' attribute was modified.');
}
}
};
// Create an observer instance linked to the callback function
var observer = new MutationObserver(callback);
// Start observing the target node for configured mutations
observer.observe(targetNode, config);
Позже вы можете прекратить наблюдение с помощью
observer.disconnect();
Спасибо за ваш ответ! Где я должен поместить свою функцию для выполнения?
@Karmakip Я бы поместил приведенный выше код внутрь document.addEventListener("DOMContentLoaded", function(event) { .... });
, чтобы убедиться, что он не пытается запустить наблюдатель до загрузки DOM. Если вы посмотрите на код, вы увидите комментарий «// Срабатывает при изменении такого атрибута, как «класс». console.info
под этим просто пример. Вы можете удалить это и поместить внутрь свой собственный код или вызвать там свою функцию.
Я получаю эту ошибку в консоли: TypeError: Не удалось выполнить «наблюдать» за «MutationObserver»: параметр 1 не имеет типа «Узел». (Ik zie dat je nederlands bent dat maakt me het mischien iets makelijker om te verstaan :))
@Karmakip Верно, однако это англоязычный веб-сайт, и ваш вопрос общедоступен. Даже если вы получите ответ, другие посетители с таким же или похожим вопросом не смогут его прочитать, если мы общаемся на голландском языке. Эта ошибка означает, что document.getElementById('gridview');
не работает. Он не может найти этот узел в DOM. Возможно, потому что DOM еще не загружен
Какая часть вашего кода удаляет скрытый класс? Не могли бы вы тогда просто использовать выполнить свой код?