可能使用Javascript将额外的类标签插入到现有列表中？

Question

鉴于有一个div诸如网页：

<div id="test" class="test">something</div> 

是否有可能插入额外的类名到列表中，以便它读取类似：

<div id="test" class="test test1 test2">something</div> 

？我可以使用innerHTML轻松更改div之间的文本，但无法找到添加到类列表的方法。

Answer 1

你想要做什么是无效的（一个元素不能有比ID以上）。一个ID不能包含空格，但Chrome似乎允许它。我不知道其他浏览器，但在Chrome中，你可以做这样的事情来更新它：

document.getElementById('test').id += ' test1 test2'; 

但随后访问元素，你将不得不使用：

document.getElementById('test test1 test2'); 

保持记住这是无效的，所以没有理由认为它应该继续在未来版本的浏览器中工作，因为它现在可以工作。

编辑

你可以使用这些Javascript函数我写的一天访问添加和删除类。 addClass函数将接受一个数组或类似数组的对象，并将该类添加到每个元素。如果它不是数组类，它只会将该类添加到该元素。使用它像：

addClass(element, 'test1'); 
addClass(element, 'test2'); 

代码：

function hasClass(el,c){ 
    var elc = ' '+el.className+' '; 
    if(elc.indexOf(' '+c+' ') < 0) 
     return false; 
    return true;  
} 

function addClass(els, c){ 
    if(typeof els.length === 'number' && typeof els[els.length-1] !== 'undefined') 
     for(var i = els.length; i--;) 
      _addClass(els[i], c); 
    else 
     _addClass(els, c); 

    function _addClass(el, c){ 
     if(c.indexOf(' ') >= 0) 
      return false; 
     if(hasClass(el, c)) 
      return true; 
     el.className += ' '+c; 
     return true; 
    } 
} 

function removeClass(els, c){ 
    if(typeof els.length === 'number' && typeof els[els.length-1] !== 'undefined') 
     for(var i = els.length; i--;) 
      _removeClass(els[i], c); 
    else 
     _removeClass(els, c); 

    function _removeClass(el, c){ 
     if(c.indexOf(' ') > -1) 
      return false; 
     if(!hasClass(el, c)) 
      return true; 
     var elc = (' '+el.className).replace(' '+c, ''); 
     if(elc.indexOf(' ') == 0) 
      elc = elc.substring(1); 
     el.className = elc; 
     return true; 
    } 
} 

精缩版：[？一个HTML元素都可以有多个ID]

function hasClass(a,d){var b=" "+a.className+" ";if(b.indexOf(" "+d+" ")<0){return false}return true}function addClass(b,e){if(typeof b.length==="number"&&typeof b[b.length-1]!=="undefined"){for(var a=b.length;a--;){d(b[a],e)}}else{d(b,e)}function d(f,g){if(g.indexOf(" ")>=0){return false}if(hasClass(f,g)){return true}f.className+=" "+g;return true}}function removeClass(b,e){if(typeof b.length==="number"&&typeof b[b.length-1]!=="undefined"){for(var a=b.length;a--;){d(b[a],e)}}else{d(b,e)}function d(f,h){if(h.indexOf(" ")>-1){return false}if(!hasClass(f,h)){return true}var g=(" "+f.className).replace(" "+h,"");if(g.indexOf(" ")==0){g=g.substring(1)}f.className=g;return true}};