原生js方法document.getElementsByClassName在ie8及其以下

在古老的网页世界中，原生JavaScript的“document.getElementsByClassName”方法曾是寻找具有特定类名的元素的强大工具。对于那些仍然沉浸在IE8及以下版本的浏览器世界里，这个方法却如天外来客般无法被识别。为了保持代码的优雅与兼容性，我们可以稍作调整，将该方法替换为自定义的“getClassNames”方法。接下来，让我们一同见证这段经过岁月沉淀的代码如何焕发新生。

原本，我们可能会如此使用该方法：

```javascript

var elements = document.getElementsByClassName('tabs_div');

```

现在，为了兼容旧版浏览器，我们采用新的调用方式：

```javascript

var divs = getClassNames('tabs_div', 'div');

```

这里的“getClassNames”函数是这样定义的：

```javascript

function getClassNames(classStr, tagName) {

// 如果浏览器支持原生的getElementsByClassName方法，则直接使用

if (document.getElementsByClassName) {

return document.getElementsByClassName(classStr);

} else {

// 对于不支持该方法的老版本浏览器，我们自定义实现

var nodes = document.getElementsByTagName(tagName);

var ret = [];

for (var i = 0; i < nodes.length; i++) {

if (hasClass(nodes[i], classStr)) {

ret.push(nodes[i]);

}

}

return ret;

}

}

```

其中，“hasClass”函数用于检查特定元素是否包含某个类名：

```javascript

function hasClass(tagStr, classStr) {

// 由于一个元素可能有多个类名，因此我们需要分割字符串并逐一比对

var arr = tagStr.className.split(/\s+/); //这个正则表达式是因为class可以有多个,判断是否包含

for (var i = 0; i < arr.length; i++) {

if (arr[i] === classStr) {

return true; // 如果找到匹配的类名，返回true

}

}

return false; // 如果没有找到，返回false

}

```