IE8下标签切换功能失效求助：IE9及以上正常，疑JS代码不兼容

嘿，我帮你排查清楚了——你的标签切换在IE8里失效，确实是IE8的JavaScript兼容性限制搞的鬼，核心问题有两个：

1. getElementsByClassName 不被IE8支持 #

IE8及更早版本根本没实现这个原生方法，你代码里靠它获取tabcontent和tablinks元素，直接导致隐藏标签、重置按钮样式的逻辑完全跑不起来。

2. IE8对元素click()方法的支持有坑 #

你最后用document.getElementById("defaultOpen").click()触发默认标签，但IE8里非表单元素的click()模拟经常失效，得换个方式触发事件。

适配IE8的修复代码 #

直接替换你原来的脚本就行，我已经把兼容逻辑写进去了：

function openPage(pageName, elmnt, color) {
    var i, tabcontent, tablinks;
    // 用getElementsByTagName+类名判断替代getElementsByClassName（兼容IE8）
    tabcontent = document.getElementsByTagName("div");
    for (i = 0; i < tabcontent.length; i++) {
        if (hasClass(tabcontent[i], "tabcontent")) {
            tabcontent[i].style.display = "none";
        }
    }
    tablinks = document.getElementsByTagName("button");
    for (i = 0; i < tablinks.length; i++) {
        if (hasClass(tablinks[i], "tablink")) {
            tablinks[i].style.backgroundColor = "";
        }
    }
    // 显示选中的标签内容
    document.getElementById(pageName).style.display = "block";
    elmnt.style.backgroundColor = color;
}

// 辅助函数：判断元素是否包含指定类名（兼容新旧浏览器）
function hasClass(element, className) {
    if (element.classList) {
        return element.classList.contains(className);
    } else {
        // IE8用正则匹配类名
        return new RegExp('(^| )' + className + '( |$)', 'gi').test(element.className);
    }
}

// 兼容IE8的默认标签触发逻辑
var defaultOpenBtn = document.getElementById("defaultOpen");
if (defaultOpenBtn) {
    if (document.createEvent) {
        // 标准浏览器和IE9+的触发方式
        var clickEvent = document.createEvent("MouseEvents");
        clickEvent.initEvent("click", true, false);
        defaultOpenBtn.dispatchEvent(clickEvent);
    } else if (defaultOpenBtn.fireEvent) {
        // IE8专属的事件触发
        defaultOpenBtn.fireEvent("onclick");
    }
}

为啥这么改？ #

• 用getElementsByTagName遍历同类型元素，再通过hasClass函数筛选出带目标类名的元素，完美绕开IE8不支持getElementsByClassName的问题。
• 模拟点击的时候做了浏览器判断：标准环境用dispatchEvent，IE8用fireEvent触发onclick，避免直接调用click()的兼容性bug。
• 加了defaultOpenBtn的存在判断，防止页面里没这个元素时报错。

内容的提问来源于stack exchange，提问作者Amerimnos