Добавить CSS класс к элементу на основе идентификатора и указанного атрибута c.

Question

Я хочу добавить новый class к body, если id имеет специфицированный атрибут c style, используя jQuery. Почему этот код не работает?

if ($('#myID').css('display') == 'none'){
  $('body').addClass('loaded');
}

Заранее спасибо!

Answer 1

Вы можете прослушивать изменения DOM на указанном c узле DOM, используя MutationObserver API, а затем запустить действие:

const targetNode = document.getElementById('my-id');

// Specify which mutations to observe (options)
const config = { attributes: true };

// Simulate the preloader action (webpage load)
setTimeout(function() {
  document.querySelector('#my-id').style ='display: none;'
}, 1000)

// Callback function to execute when mutations are observed
const callback = function (mutationsList, observer) {

  console.log(`Mutation type: ${mutationsList[0].type}`)
  console.log(`ID ${mutationsList[0].target.id}`);
  
  // Make the necessary changes to your target elements here
  document.querySelector('body').classList.add('loaded');

};

// Create an observer instance linked to the callback function
const observer = new MutationObserver(callback);

// Start observing the target node for configured mutations
observer.observe(targetNode, config);

.loaded {
  background-color: crimson;
}

<div id="my-id">Loading..</div>

Примечание: Весь код является Vanilla JS (нет jQuery).

Пример создан с использованием кода из официальной документации

Answer 2

Я нашел решение. Работает, когда я постоянно проверяю, а не только один раз:

function check_loader(){
      if ($('#ple-loader-wraps99').css('display') == 'none'){
        $('body').addClass('loaded');
      };};
window.setInterval(check_loader,1000);