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

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”，而不是“class is found!”:

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