Question

我终于弄清楚是什么让我称之为'文件夹'的元素打开和关闭。问题是，当我通过validator运行HTML文档时，此时<isfolder="true">元素上不允许使用属性div。

<p></p>
<div class="folderOpenClose" onclick="toggleAllFolders();">Open/Close Folders</div>
<p></p>
<div class="folderlabel" onclick="togglefolder(&#39;folder0&#39;);">Dice Roller</div>
<div id="folder0" class="folder" isfolder="true" style="display: none;">
</div>
<p></p>
<div class="folderlabel" onclick="togglefolder(&#39;folder1&#39;);">Slide Show</div>
<div id="folder1" class="folder" isfolder="true" style="display: none;">
</div>
<p></p>
<div class="folderlabel" onclick="togglefolder(&#39;folder2&#39;);">Carousel</div>
<div id="folder2" class="folder" isfolder="true" style="display: none;">
</div>
<p></p>
<div class="folderlabel" onclick="togglefolder(&#39;folder3&#39;);">Menu Bar</div>
<div id="folder3" class="folder" isfolder="true" style="display: none;">
</div>
<p></p>

我删除的问题是操作Open / Close All的问题，当我尝试将代码放在表单中时，Open / Close文件夹不起作用。

    var lastChecked = null;            




function togglefolder(id){ 
    var ele = object(id);
    if(ele.style.display == 'none') ele.style.display='block';
    else ele.style.display = 'none';
}


function setAllFolders(how){
    var way = ""+how;
    if(way == "") way = "none";
    if(way == "closed") way = "none";
    if(way == "open") way = "block";

    var divs = window.document.getElementsByTagName('div');
    for(var i=0; i < divs.length; i++){

        if(divs[i].getAttribute('data-isfolder')&&divs[i].getAttribute('data-isfolder')=='true') 
            divs[i].style.display = way;

        var thisClass = ""+divs[i].getAttribute('class');

        if(thisClass=='folderlabel'){
            var thelabel = ""+divs[i].innerHTML;
            if(thelabel.indexOf('open/close all folders') != -1)
                divs[i].setAttribute('class','folderlabelopen');
        }
    }

    last_toggle=way;
}

Answer 1

<div id="folder2" class="folder" isfolder="true" style="display: none;"></div>

isfolder不是已知的HTML属性，因此会被标记。

一种解决方案是使用data-*属性，例如：

<div id="folder2" class="folder" data-isfolder="true" style="display: none;"></div>

然后您的代码可以使用：

if(divs[i].getAttribute('data-isfolder') == 'true')

您还可以使用漂亮的dataset API。

More info on data-* properties.

JavaScript验证错误

1 个答案: