classList属性在IE9及IE8上的兼容性处理

最新推荐文章于 2026-07-03 09:26:27 发布

原创

最新推荐文章于 2026-07-03 09:26:27 发布 · 1.2k 阅读

收录于

当前文章被以下社区和专栏收录：

本文介绍了在开发中遇到的HTML5 classList属性在Internet Explorer 8和9上的兼容性问题，并详细分析了网上常见解决方案存在的问题。针对这些问题，文章提出并实现了修正后的解决方案，包括替换`HTMLElement`为`window.Element`，使用jQuery的`inArray`方法替代不兼容的`indexOf`，以及调整`Object.defineProperty()`的使用，确保在IE8及更高版本的兼容性。

最近开发遇到IE8和IE9中classList的兼容性问题，在网上查找后发现许多解决方案都存在一定的小问题，现贴出正确的解决方案：

这是网上找到的解决方案：

if (!("classList" in document.documentElement)) {
    Object.defineProperty(HTMLElement.prototype, 'classList', {
        get: function() {
            var self = this;
            function update(fn) {
                return function(value) {
                    var classes = self.className.split(/\s+/g),
                        index = classes.indexOf(value);
 
                    fn(classes, index, value);
                    self.className = classes.join(" ");
                }
            }
 
            return {
                add: update(function(classes, index, value) {
                    if (!~index) classes.push(value);
                }),
 
                remove: update(function(classes, index) {
                    if (~index) classes.splice(index, 1);
                }),
 
                toggle: update(function(classes, index

标签