IE9报错：Object doesn't support property or method 'item' 技术求助

嘿，我太懂你这种IE9怪异模式下的痛苦了——明明现代浏览器跑的好好的，到了兼容模式就各种奇葩报错，还不能改HTML，只能死磕JS。针对你遇到的「Object doesn't support property or method 'item'」问题，我给你几个靠谱的解决方案：

1. 手动遍历DOM筛选类名（最稳妥的兼容方案） #

既然IE9怪异模式下document.getElementsByClassName()彻底用不了，那就手动遍历所有元素，检查class属性里是否包含目标类名。这种方法兼容性拉满，不管什么模式都能跑：

function getElementsByClassNameCompat(className) {
  var allElements = document.getElementsByTagName('*');
  var result = [];
  // 用正则匹配完整的类名，避免匹配到类似"buttonitems-xxx"的情况
  var classNameRegex = new RegExp('(^|\\s)' + className + '(\\s|$)');
  
  for (var i = 0; i < allElements.length; i++) {
    var elem = allElements[i];
    if (classNameRegex.test(elem.className)) {
      result.push(elem);
    }
  }
  return result;
}

// 调用示例
var buttonItems = getElementsByClassNameCompat('buttonitems');
// 重点：这里返回的是普通数组，直接用索引访问就行，完全不用item()
for (var j = 0; j < buttonItems.length; j++) {
  // 这里处理你的buttonItems元素
  console.log(buttonItems[j]);
}

为什么不用item()？因为IE9怪异模式下，有些DOM集合不是标准的HTMLCollection，原生item()方法会失效，但数组索引[index]是所有JS环境都支持的，绝对靠谱。

2. 修复item()方法的兼容问题（如果已经拿到元素集合） #

如果你已经通过UA判断或者其他方式拿到了目标元素集合，但还是因为item()报错，那可以直接用索引替代，或者给集合原型补全这个方法：

// 方法A：直接替换item()为索引访问（推荐）
// 原来的代码：var elem = collection.item(0);
// 改成：
var elem = collection[0];

// 方法B：给DOM集合原型补全item方法（适合需要保留原有代码结构的情况）
if (typeof HTMLCollection !== 'undefined' && !HTMLCollection.prototype.item) {
  HTMLCollection.prototype.item = function(index) {
    return this[index] || null;
  };
}
if (typeof NodeList !== 'undefined' && !NodeList.prototype.item) {
  NodeList.prototype.item = function(index) {
    return this[index] || null;
  };
}

不过还是优先用索引访问，怪异模式下的DOM对象行为太诡异，补全方法可能会有意外问题。

3. 试试querySelectorAll（简洁备选方案） #

虽然IE9怪异模式下getElementsByClassName失效，但document.querySelectorAll()有时候能正常工作（取决于具体的兼容模式版本），可以先试试这个：

var buttonItems = document.querySelectorAll('.buttonitems');
// 同样用索引访问，不用item()
for (var k = 0; k < buttonItems.length; k++) {
  console.log(buttonItems[k]);
}

如果这个方法能用，那代码会简洁很多，建议先在你的环境里测试一下。

额外提醒：别过度依赖UA判断 #

你提到用navigator.userAgent.toLowerCase()来判断浏览器，这里要踩个坑：IE9的怪异模式下，UA字符串可能会伪装成IE7（显示msie 7.0），单纯靠UA判断容易出错。不如用特征检测更可靠：

// 检测是否支持getElementsByClassName
var supportsGetByClass = typeof document.getElementsByClassName === 'function';
// 检测是否处于怪异模式
var isQuirksMode = document.compatMode === 'BackCompat';

用真实的浏览器能力来判断，比UA靠谱多了，毕竟UA可以被修改，而特征是骗不了人的。

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