包含可折叠递归目录列表的 HTML

Posted 2023-02-23

【中文标题】包含可折叠递归目录列表的 HTML

【英文标题】：HTML containing a collapsible recursive directory listing

【发布时间】：2012-09-06 19:40:16

【问题描述】：

我想生成一个（静态）html 文件，该文件将在浏览器中显示一个递归目录列表，其中包含可折叠的子目录。

目前，我以以下方式使用树：

tree -H http://dl.dropbox.com/u/<user_id> > web/directory_listing.html

这会产生一个 HTML 递归目录（和文件）列表。为了清楚起见，我希望目录内容默认折叠。选择目录时，所选目录中的目录和文件会展开并出现在同一页面中。

有什么方法可以生成这种类型的 HTML 吗？也许可以修改树的输出。我想要一个 HTML 文件列表的原因是因为我没有很多服务器控制权（这是为了托管在 Dropbox 上）。

非常感谢您的帮助

【参考方案1】：

如果您在使用 tree 之类的东西时遇到问题，也许可以添加一些 javascript 来实现您的元素显示/隐藏效果。这可以通过在树 HTML (tree -H) 输出的末尾连接一个 javascript 文件来轻松实现。

tree -H http://dl.dropbox.com/u/<user_id> > web/directory_listing_part.html
cat web/directory_listing_part.html web/some_file_containing_your_javascript_code > web/directory_listing.html

如果你愿意，你甚至可以使用 javascript 来提供额外的样式。

看看这个页面：

http://mama.indstate.edu/users/ice/00Tree.html

这为您可以实现的格式提供了一个很好的示例。请注意类名的使用，这应该很容易让您与 javascript/jquery 挂钩