关于onclick一些问题请教

Question

 静态页面是这样的         
    如图：
我想问的是我在js里面这样写就可以：
window.onload = function() {
    var check = $(".check_img_contant");
    console.log(check);
    check.on('click', function() {
        var cc = $(this).attr('src');
        if (cc == 'image/images6.gif') {
            $(this).attr('src', 'image/images3.gif')
        } else {
            $(this).attr('src', 'image/images6.gif')
        }
    })
};
为何换一种写法就不行：下面是不行的：
window.onload = function() {
    var check = document.getElementsByClassName("check_img_contant");
    console.log(check);
    check.onClick = function() {
        var cc = $(this).attr('src');
        if (cc == 'image/images6.gif') {
            $(this).attr('src', 'image/images3.gif')
        } else {
            $(this).attr('src', 'image/images6.gif')
        }
    }
}请打什么指点

Answer 1

因为document.getElementsByClassName方法返回的是数组，需要用[0]获取数组的0下标元素
var check = document.getElementsByClassName("check_img_contant")[0];另外 onclick 事件要全小写

Answer 2

楼上正解，jq和js的一个区别就在这

Answer 3

var checks = document.querySelectorAll("check_img_contant")
for(var check in checks){
    check.onclick=function(){
        var cc=this.src
        // continue
    }
}

Answer 4

上面搞错了；
var checks = document.querySelectorAll(".check_img_contant")
for(var i in checks){
    (function(i){
        checks[i].onclick=function(){
            var cc=this.src
            if (cc == 'image/images6.gif') {
                this.src='image/images3.gif'
            } else {
                this.src='image/images6.gif'
            }
        }
    })(i)
}