无法理解 classie.js API

Question

大家好，我正在另一个站点上完成一个幻灯片和推送菜单的示例，并且正在努力理解源下载中包含的 classie.js 文件中的 if 语句。

if ( 'classList' in document.documentElement ) {
  hasClass = function( elem, c ) {
    return elem.classList.contains( c );
  };
  addClass = function( elem, c ) {
    elem.classList.add( c );
  };
  removeClass = function( elem, c ) {
    elem.classList.remove( c );
  };
}
else {
  hasClass = function( elem, c ) {
    return classReg( c ).test( elem.className );
  };
  addClass = function( elem, c ) {
    if ( !hasClass( elem, c ) ) {
      elem.className = elem.className + ' ' + c;
    }
  };
  removeClass = function( elem, c ) {
    elem.className = elem.className.replace( classReg( c ), ' ' );
  };
}

我似乎无法理解第一个 IF 语句。我的理解是 document.documentElement returns <html> 标签，但 'classList' 业务是什么？我唯一能找到的是 mdn，但我完全不明白 IF 语句测试的是什么。任何帮助，将不胜感激。谢谢

Answer 1

较新的浏览器在 DOM 元素节点上支持 .classList 属性。它是 class 个名称的数组。较旧的浏览器仅支持 .className 属性，这是一个包含 space 分隔的 class 名称的单个字符串。

如果您发布的代码中的 if 语句看到文档节点有一个 .classList 属性，它知道它在较新的浏览器上是运行。如果没有，那么它会创建一些 class 管理实用程序的替代版本。

Answer 2

'classList' in document.documentElement 只是检查 document.documentElement 元素中是否存在 classList。

来自 MDN's documentation on the in operator.

The in operator returns true if the specified property is in the specified object.

无法理解 classie.js API

having trouble understanding classie.js API

javascript

classiejs