纯javascript通过样式类名获取元素

习惯了jQuery选择的方便，偶而遇到纯javascript前端的时候才发现选择某样式的元素也变的不简单，网上查了下document.getElementsByClassName这个方法好象可以直接获取样式元素，ie6没有测试是否兼容，然后自己写了一个通过指定标签、样式获取元素的方法，记录一下方便以后查看使用。

通过样式class获取div等标签元素的代码如下：样式名必需，tag可选为空则匹配所有标签

<div class="qmtx3 sdf">
    包含qmtx3样式的div标签
</div>
<div class="sdf qmtx3">
    包含qmtx3样式的div标签
</div>
<p class="qmtx3">
    包含qmtx3样式的P标签
</p>
<div class="dsn sdfsdf">
    包含qmtx3样式的div标签
</div>
<div class="sdfsdf sssdsn sdf">
    不包含qmtx3样式
</div>
<script>
function getClassObj(className, tag){
    tag = tag||document;
    className = className||'*';
    var findarr = [];
    if(document.getElementsByClassName){
        return document.getElementsByClassName(className);
    }
    el = document.getElementsByTagName(tag);
    var pattern = new RegExp("(^|s)" + className + "(s|$)");
    for(var i=0; i<el.length; i++){
        if(pattern.test(el[i].className)){
            findarr.push(el[i]);
        }
    }
}
window.onload = function(){
    console.log(getClassObj('qmtx3'));
}
</script>

想下jQuery实现的话真的太简单了，直接$('.classname')就搞定，用纯javascript要整这么一大段，不过原生态javascript也是要学习的，不然离开了jQuery就不会js了。

相关文章推荐：

1.jQuery获取屏幕高度和滚动条滚动高度的方法

2.dedecms制作Html+Css代码运行框jQuery版

3.跟版网jQuery选项卡插件代码很少

4.jQuery获取元素索引index()方法

5.<script>标签类型属性用type="text/javascript"还是language="javascript"好