getElementsByClassName方法（ 'EL'）[0]未定義

Question

<div class="b1"></div> 
<div class="b2"></div> 
<div class="b3"></div> 

function create(htmlStr){ 
    var frag = document.createDocumentFragment(), 
    temp = document.createElement('div'); 
    temp.innerHTML = htmlStr; 
    while (temp.firstChild){ 
     frag.appendChild(temp.firstChild); 
    } 
    return frag; 
} 

var _bM=document.getElementsByClassName('.b'+1); 

_bM.appendChild(create('<img src="'+some_data+'"class="q q'+some_var+'"/>')); 

Uncaught TypeError: Object #<NodeList> has no method 'appendChild'

其中爲：

var _bM=document.getElementsByClassName('.b'+1)[0]; 

Uncaught TypeError: Cannot call method 'appendChild' of undefined

im on chrome version 31.我試圖做純JavaScript而不是jquery，因爲我需要速度並且必須使用class not id。爲什麼發生這種情況？

Answer 1

使用document.getElementsByClassName('b'+1)而不是document.getElementsByClassName('.b'+1)

你不需要.與getElementsByClassName

Answer 2

你不應該在JavaScript的一個點前綴的類名。只需var _bM=document.getElementsByClassName('b'+1)[0];即可。

Answer 3

除了其他答案。如果您需要跨瀏覽器解決方案，並且速度很重要，請嘗試使用此腳本。適用於所有現代和舊版瀏覽器。使用超快速的querySelectorAll。如果不可用，則降級爲本機getElementsByClassName。如果還不可用，仍然可以使用（速度較慢，但​​即使在非常老的IE中也可以使用）。這是一個代碼：

function gEByClass(cName, el) { 
getElementsByClass = function(getClass){ 
el = el||document; 
if(el.querySelectorAll) { 
return el.querySelectorAll("." + getClass); 
} 
else if(el.getElementsByClassName) { 
return el.getElementsByClassName(getClass); 
} 
else { 
var list = el.getElementsByTagName('*'), i = list.length, 
classArray = getClass.split(/\s+/), result = []; 
while(i--) { 
if(list[i].className.search('\\b' + classArray + '\\b') != -1) { 
result.push(list[i]); 
} 
} 
return result; 
} 
}; 
return getElementsByClass(cName); 
}