展開和折疊其實就是顯示或不顯示display：none or block）它與可見與不可見（visible or invisible）是有區別的， 前者不在頁面預留空間。 這個toggle函數完成兩個功能， 改變TR原來的Hidden屬性， 使原來不顯示的顯示； 改變IMG的src屬性， 更改圖片。

toggle.js

function toggle(id)
{
var thisRow = document.all.item(id);
if (thisRow)
{
if (thisRow.getAttribute("Expanded") == 'yes')
{
thisRow.setAttribute("Expanded", "no");
thisRow.children(0).children(0).children(0).src = "images/bs.gif";

var allRows = document.all.tags("TR");
for (var i=1; i < allRows.length; i++)
{
var row = allRows[i];
if (row.getAttribute("AncestorID") == id)
{
if (row.getAttribute("Expanded") == 'yes') {
toggle(row.getAttribute("id"));
}
row.className = 'Navigator-Hidden';
}
}
thisRow.className = 'Navigator';
}
else
{
thisRow.setAttribute("Expanded", "yes");
thisRow.children(0).children(0).children(0).src = "images/bo.gif";

var allRows = document.all.tags("TR");
var depth = parseInt(thisRow.getAttribute("Depth"));
for (var i=1; i < allRows.length; i++)
{
var row = allRows[i];
if (row.getAttribute("AncestorID") == id &&
parseInt(row.getAttribute("Depth")) == depth + 1 )
{
row.className = 'Navigator';
}
}
}
}
}

到此結束。

誠然這個TOC的功能還是最基本的， 例如我還未做內容和目錄的同步，其中有的地方還可以修改， 對xml和xsl文件可以進一步瘦身。 不過對一般用戶來講， 這已經足夠了。
真誠希望這篇文章能對您有所啟發、有所幫助， 以后做出更酷、更快、更方便、功能更強的TOC。