Question

嘿有一种方法可以将javascript中的类添加到未激活的元素中吗？我用了

$( ".myelement ).attr('class', 'myelement toast');

myelement不会出现在我的代码中，所以在我启动它之前不会应用该类吗？

Answer 1

绝对正确：您将无法将属性，数据，属性等添加到尚未包含在DOM中的元素。

每次创建“.myelement”节点并将其添加到页面时，您都需要执行该调用。

顺便说一句，对于CSS课程，不要使用“attr” - 而是使用jQuery's class methods。

希望这有帮助！

Answer 2

检查一下：

let exist = false;
document.body.addEventListener("DOMSubtreeModified", function() { 
// http://caniuse.com/#search=DOMSubtreeModified

  // warning : this will run everytime the dom modified
  // this check will prevent unwanted loops
  if(!exist) {
    setTimeout( function() {
      const theDiv = document.getElementById('theDiv');
      if(theDiv && !exist) {
        exist = true;
        console.log("It is right there, let's add a class to it");
        
        // add some delay (not a must, just to follow easily)
        setTimeout( function() {
          theDiv.setAttribute('class', theDiv.getAttribute('class')+' cool');
          console.log('done!')
        },1000);
      }
    },0);
  }
});

console.log("Waiting 2 seconds...");

// delay to follow things easily
setTimeout( function() {
  console.log("Creating a div..");
  let newDiv = document.createElement('div');
  newDiv.innerHTML = 'Cool!';
  newDiv.setAttribute('id','theDiv');
  document.body.appendChild(newDiv);
  console.log("Created.");
},2000);

.cool {
  background-color: red;
  color: white;
  font-weight: bold;
}

将css添加到尚不存在的类中

2 个答案: