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

我在chrome版本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);
}

getElementsByClassName（'el'）[0]未定义

3 个答案: