Question

我在html doc中有6个div，具有以下特征：

<div id="m1_1"  title="Sept. 05, 2011" class="eheader">MR 1 &#151;</div>
<div id="m1_8"  title="Sept. 05, 2011" class="eheader">MR 8 &#151;</div>
<div id="m1_12" title="Sept. 05, 2011" class="eheader">MR 12 &#151;</div>
<div id="m1_16" title="Sept. 12, 2011" class="eheader">MR 16 &#151;</div>
<div id="m1_17" title="Sept. 12, 2011" class="eheader">MR 17 &#151;</div>
<div id="m1_19" title="Sept. 15, 2011" class="eheader">MR 19 &#151;</div>

他们的id类似于m1_1，m1_2，m1_3，m1_4，m1_5和m1_6。下划线后面的数字是动态生成的，所以我不能直接定位说...“m1_8”。

它们共享同一个组，该组对于该组是唯一的。在我的CSS中，我将此类的div的display属性设置为“hidden”或“none”。

它们都有一个title元素，设置为它们的创建日期。

我需要的是一个函数，它将按类名循环遍历div并定位所有唯一标题和任何重复标题的第一个成员。在上面的示例中，m1_19将成为目标，因为其标题（创建日期）对于集合是唯一的。 divs m1_1和m1_16也将被定位，因为它们是重复的第一个成员。

我的功能大纲看起来像这样......当然有大量的逻辑缺失，我甚至不确定我是否正确设置了循环。可以这样做，还是我完全走错了路？

function checkHeaders(){
    var hdrSet = document.getElementsByClassName("eheader");

    for (var i=0; i<hdrSet.length; i++){
        if (hdrSet[i].title {
            hdrSet[i].style.display = "block";
        }
    }

}

Answer 1

function checkHeaders(){
    var hdrSet = document.getElementsByClassName("eheader");
    var titles = {};

    for (var i=0; i<hdrSet.length; i++){
        if ( !titles[ hdrSet[i].title ] )  {
            titles[ hdrSet[i].title ] = true;
            hdrSet[i].style.display = "block";
        }
    }
}

Answer 2

我认为这就是你所追求的目标：

function checkHeaders(){
    var hdrSet = document.getElementsByClassName("eheader");
    var title;

    for(var i=0; i<hdrSet.length; i++){
        if(title != hdrSet[i].title){
            title = hdrSet[i].title;
            hdrSet[i].style.display = 'block';
        }
    }
}

checkHeaders();

示例： http://jsfiddle.net/Vk7Ud/

<强>解释

var hdrSet = document.getElementsByClassName("eheader");
//grab all the divs

var title;
//set a variable to contain the titles

for(var i=0; i<hdrSet.length; i++){
//for each div

    if(title != hdrSet[i].title){
    //if the title does not match the one that is set, continue 
    //(first one is always fine, as nothing is set)   

        title = hdrSet[i].title;
        //then set the latest title to title

        hdrSet[i].style.display = 'block';
        //display the div
        }
    } 
}

checkHeaders();

Answer 3

function checkHeaders(){
    var hdrSet = document.getElementsByClassName("eheader");
    var prevTitle = '';
    for (var i=0; i<hdrSet.length; i++){
        if ( hdrSet[i].title) {
            if ($prevTitle != hdrSet[i].title) {
                hdrSet[i].style.display = "block";
            }
            $prevTitle = hdrSet[i].title;
        }
    }
}

定位数组的唯一和第一个重复成员

3 个答案: