javascript - 覆盖库中的悬停事件

Question

现在，我正在使用提供特定小部件的 JS 库。

基本上我有了列表(删除了很​​多样板 DOM，因为它没有必要显示):

<li class="disabled">

当我将鼠标悬停在上面时，我得到:

<li class="disabled state-active"> 

如果该类已包含禁用，我想通过添加“state-active”类来覆盖此悬停事件。

执行此操作的最佳方法是什么？

Answer 1

您可以循环遍历您的列表项，创建每个项的克隆并将原始项替换为克隆项。使用 cloneNode 克隆元素不会复制附加到该节点的事件:

var lis = document.getElementsByTagName('li');
for(i=0; i<lis.length; i++){
    liClone = lis[i].cloneNode(true);
    lis[i].parentNode.replaceChild(liClone,lis[i]);
}

JSFiddle

文档:

• > .cloneNode()