JQuery学习之旅（6）

类选择器JQuery学习之旅（6）—类选择器

类选择器： 通过class样式的类名获取节点 JQuery的类选择器： 获取节点集合，

$('.class'); 

相对于id选择器

$('#id');  //获取唯一节点

类选择器 多选就是相对效率低，

在浏览器兼容情况下：   (1) javascript原生的getElementsByClassName(“类名”)；(进行循环获取)   (2) JQuery方法： $(‘.class’); 实现如下： 原生：

    
        var divs = document.getElementsByClassName("aaron");
        for ( var i = 0; i < divs.length; i++) {
            divs[i].style.border = "5px solid blue";
        }
    

JQuery:

    
        $(".imooc").css("border", "5px solid red");
        

在注意一下：类名属性 class=”xxx”;

        id="aaron"
        选中
    

具体代码：

$(".class")

    div{
        width: 100px;
        height: 90px;
        float: float;
        margin: 5px;
        padding: 5px;
        background-color: #eeeeee;
    }




    
        id="aaron"
        选中
    
    
        id="aaron"
        选中
    
    
        id="imooc"
        JQuery选中
    
    
        id="imooc"
        JQuery未选中
    

    
        var divs = document.getElementsByClassName("aaron");
        for ( var i = 0; i < divs.length; i++) {
            divs[i].style.border = "5px solid blue";
        }
    

    
        $(".imooc").css("border", "5px solid red");