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

Check if dynamically added class exists

本文关键字：添加 动态 是否 存在 检查      更新时间：2023-09-26
document.addEventListener('DOMContentLoaded', function() {
    if (document.getElementsByClassName('myclass').length) {
        doSomething();
    }
});

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

好吧，想想你对听众做了什么。你让此代码在 DOMContentLoaded 事件触发时运行。如果要在其他地方更改 DOM，则无法保证此代码将在之后运行。事实上，除非您手动发出该事件，否则它似乎每页只会运行一次。

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

例如，以下代码生成"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 链接：

加工

不工作

使用 className.indexOf 

myElement = document.getElementById("IdOfTheElement");
if(myElement.className.indexOf('MyClassName') != -1){
   /* The class exist*/
}
相关文章：