PHP应用:用XSLT轻松实现树形折叠导航栏
每一发奋努力的背后,必有加倍的赏赐。以下百分网小编整理的用XSLT轻松实现树形折叠导航栏的知识,希望对大家有所帮助,更多信息请关注应届毕业生网!
展开和折叠实在就是显示或不显示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文件可以进一步瘦身。 不过对一般用户来讲, 这已经足够了。