当浏览器本身没有实现classList对象时，创建我自己的classList对象

Create my own classList object when the browser does not implement it itself

本文关键字：classList 对象 创建 自己的 我自己 实现 浏览器      更新时间：2023-09-26

我有使用classList对象添加和删除类的JavaScript代码。代码正常运行，直到我收到投诉，因为它不能在Opera和IE8中工作。

我不想使用任何框架或代码库。我想减少到一个最大的代码，我必须改变我的程序，所以我想做我自己的classList对象，并将其添加到节点对象。我已经有了这个代码:

if (typeof(document.createElement('input').classList) == 'undefined') {
    HTMLElement.prototype.classList = new function () {
        this.add = function (addClass) {
            this.className += addClass;
        }
    }
}

显然不起作用。问题是:我不能像这样访问这个对象的HTMLElement.className。我怎么才能做到呢?我怎么能使这个对象的工作类似或完全像原来的?

Mozilla在这里列出了一个classList shim:

http://developer.mozilla.org/en/DOM/element.classList

代码中有相当多的内容，但看起来是您想要的。

您可以创建一个辅助函数来返回您需要的值，而不是扩展原型:

classList = function ( elem ) {
    return elem.className.replace(/'s+/g,' ').split(' ');
};

然后，而不是调用elem.classList，你只调用classList(elem)，这意味着它不完全像原来的工作，但它返回相同的数据。

相关文章：