Question

document.addEventListener('DOMContentLoaded', function() {
    if (document.getElementsByClassName('myclass').length) {
        doSomething();
    }
});

如果<div class="myclass">...</div>直接写在HTML文档中，但是如果它由JavaScript本身插入则不行。有什么想法吗？

Answer 1

好吧，想一想你对听众的所作所为。当DOMContentLoaded事件触发时，您正在运行此代码。如果您在其他地方更改DOM，则无法保证此代码将在之后运行。事实上，除非您手动发出该事件，it seems like每个页面只会运行一次。

但是，由于我不知道在运行时附加类的代码是什么，我不能更具体。

例如，以下代码生成'dom loaded'，但不会'找到类！'：

document.getElementById("foo").className = "myclass";

document.addEventListener('DOMContentLoaded', function() {

  alert('dom loaded');

    if (document.getElementsByClassName('myclass').length) {
       alert('My class is found!');
    }
});

以下代码按预期生成。

document.addEventListener('DOMContentLoaded', function() {

  alert('dom loaded');

  document.getElementById("foo").className = "myclass";

    if (document.getElementsByClassName('myclass').length) {
       alert('My class is found!');
    }
});

为了告诉你我的意思，这里有plunkr链接：

working

not working

Answer 2

使用className.indexOf

myElement = document.getElementById("IdOfTheElement");

if(myElement.className.indexOf('MyClassName') != -1){
   /* The class exist*/
}

检查是否存在动态添加的类

2 个答案: