Запустите функцию один раз в цикле MutationObserver for ⇐ Javascript
-
Гость
Запустите функцию один раз в цикле MutationObserver for
Я использую MutationObserver, чтобы наблюдать, не меняет ли какой-либо элемент класса last-move свой встроенный стиль. Например, это может выглядеть так: На странице есть два квадрата с этим классом last-move, поэтому мне нужно наблюдать, не изменится ли какой-нибудь из них. Если один или оба из них изменятся, я бы хотел запустить функцию pieceMoved(). Это основа, с которой я работаю.
function ObserveNewMove() { const targetElements = document.querySelectorAll('.last-move'); targetElements.forEach((targetElement) => { const наблюдатель = новый MutationObserver((mutationsList, наблюдатель) => { for (constmutation ofmutationsList) { // Цикл For, чтобы увидеть, изменился ли какой-либо из двух элементов. if (mutation.type === 'attributes' &&mutation.attributeName === 'style') { кусокMoved(); // Функция, вызываемая один раз. } } }); Observer.observe(targetElement, {атрибуты: true}); }); } Проблема заключается в том, что pieceMoved() вызывается как минимум дважды, поскольку два квадрата с классом last-move в большинстве случаев меняют стиль, но я бы например, чтобы pieceMoved() вызывался один раз, даже если цикл for выполняется в течение двух итераций.
Подводя итог, я бы хотел, чтобы pieceMoved() запускался только один раз, даже если цикл for выполняет больше итераций.
Я пробовал использовать разные типы систем флагов как с локальными, так и с глобальными переменными, начиная с «ложь-истина», затем «истина-ложь» и все, что между ними. Вот пример
function ObserveNewMove() { пусть флаг = ложь; const targetElements = document.querySelectorAll('.last-move'); targetElements.forEach((targetElement) => { const наблюдатель = новый MutationObserver((mutationsList, наблюдатель) => { for (constmutation ofmutationsList) { // Цикл For, чтобы увидеть, изменился ли какой-либо из двух элементов. if (mutation.type === 'attributes' &&mutation.attributeName === 'style') { если (флаг) { кусокMoved(); // Функция, вызываемая один раз. } флаг = правда; } } }); Observer.observe(targetElement, {атрибуты: true}); }); } Это будет работать при первом вызове observeNewMove(), но не при последующих перемещениях (поскольку observeNewMove() больше не вызывается, он работает вечно до отключения, если я правильно понял). Изменение размещения let flag = false; либо приведет к тому, что pieceMoved() никогда не будет вызываться (flag = false всегда, либо будет вызываться дважды время (flag = true всегда).
Я использую MutationObserver, чтобы наблюдать, не меняет ли какой-либо элемент класса last-move свой встроенный стиль. Например, это может выглядеть так: На странице есть два квадрата с этим классом last-move, поэтому мне нужно наблюдать, не изменится ли какой-нибудь из них. Если один или оба из них изменятся, я бы хотел запустить функцию pieceMoved(). Это основа, с которой я работаю.
function ObserveNewMove() { const targetElements = document.querySelectorAll('.last-move'); targetElements.forEach((targetElement) => { const наблюдатель = новый MutationObserver((mutationsList, наблюдатель) => { for (constmutation ofmutationsList) { // Цикл For, чтобы увидеть, изменился ли какой-либо из двух элементов. if (mutation.type === 'attributes' &&mutation.attributeName === 'style') { кусокMoved(); // Функция, вызываемая один раз. } } }); Observer.observe(targetElement, {атрибуты: true}); }); } Проблема заключается в том, что pieceMoved() вызывается как минимум дважды, поскольку два квадрата с классом last-move в большинстве случаев меняют стиль, но я бы например, чтобы pieceMoved() вызывался один раз, даже если цикл for выполняется в течение двух итераций.
Подводя итог, я бы хотел, чтобы pieceMoved() запускался только один раз, даже если цикл for выполняет больше итераций.
Я пробовал использовать разные типы систем флагов как с локальными, так и с глобальными переменными, начиная с «ложь-истина», затем «истина-ложь» и все, что между ними. Вот пример
function ObserveNewMove() { пусть флаг = ложь; const targetElements = document.querySelectorAll('.last-move'); targetElements.forEach((targetElement) => { const наблюдатель = новый MutationObserver((mutationsList, наблюдатель) => { for (constmutation ofmutationsList) { // Цикл For, чтобы увидеть, изменился ли какой-либо из двух элементов. if (mutation.type === 'attributes' &&mutation.attributeName === 'style') { если (флаг) { кусокMoved(); // Функция, вызываемая один раз. } флаг = правда; } } }); Observer.observe(targetElement, {атрибуты: true}); }); } Это будет работать при первом вызове observeNewMove(), но не при последующих перемещениях (поскольку observeNewMove() больше не вызывается, он работает вечно до отключения, если я правильно понял). Изменение размещения let flag = false; либо приведет к тому, что pieceMoved() никогда не будет вызываться (flag = false всегда, либо будет вызываться дважды время (flag = true всегда).
Мобильная версия