Question

堆栈

我想在html中动态显示一个易于编辑的产品页面。我的设置是一堆xml文件，每个产品一个，它们将与它们使用的html页面进入同一目录。然后当页面加载时，它还会读入目录中的所有xml文件，这些文件可能会经常更改。

我想在javascript中执行此操作，但我不知道如何在当前目录中开发文件列表。我能找到的唯一信息是关于在客户端计算机上查找我不需要的文件。我需要在当前目录中列出服务器上的所有文件。一旦我知道了名称，我已经有了加载文件的代码，我只需要一个文件名列表来放入函数。

一如既往地感谢你的帮助。

RShom

Answer 1

最简单的方法是在服务器上安装一个脚本，将脚本作为JSON编码字符串发送。

此php脚本输出所有带有.xml扩展名的xml文件，这些文件与脚本位于同一目录中（只需将opendir更改为使用其他路径）

<?php
$files = array();

if($handle = opendir(dirname(__FILE__))) {
    while (false !== ($file = readdir($handle))) {
        if(substr($file, -4) == ".xml")
            $files[] = $file;
    }

    closedir($handle);
}

echo json_encode($files);
?>

然后你会在javascript中使用ajax获取json，这里使用jQuery：

$.getJSON("http://example.com/path/to/script.php" function(files) {
    // Do something with the files
});

唯一的另一种方法是依赖服务器生成索引（例如apach autoindex），但这样做会更多。

Answer 2

好的，这样做可以打开潘多拉的盒子，但也有很多很酷的功能，数不胜数......即使没有PHP，它仍然是完全可行的......

一种方式：

在Apache中打开XHTML文件列表。转到您的/etc/apache2/httpd.conf，确保您已取消注释

LoadModule autoindex_module libexec/apache2/mod_autoindex.so

以及关闭您可能拥有的任何IndexOptions并将其替换为......

IndexOptions XHTML SuppressHTMLPreamble Type=text/xml

重新启动apache，浏览到你配置的VirtualHost ..你应该有一个很好的样式文件列表，其源代码类似于...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Index of /dir/CRUD</title>
</head>
<body>
<h1>Index of /dir/CRUD</h1>
<ul><li><a href="/dir/"> Parent Directory</a></li>
<li><a href="CRUD.aspx"> CRUD.aspx</a></li>

<li><a href="CRUD.aspx.cs"> CRUD.aspx.cs</a></li>
<li><a href="member.xml"> member.xml</a></li>
<li><a href="web.config"> web.config</a></li>
</ul>
<address>Apache/2.2.17 (Unix) PHP/5.3.4 Server at yourserver,net Port 80</address>
</body></html>

正如您所看到的，这是一个相当简单，有效的XML文件，包含您要列出的任何目录。现在，有了XML格式的文件列表，您可以根据需要在样式，解析和操作方面获得所需的创意......您可以轻松设置一个自动库，显示每个文件在文件夹中，或者您可以使用该信息生成一个javascript数组，并使用它执行无数其他RSS，JSON或whathaveyou函数。

另一种方式，不需要对您的apache IndexOptions 进行任何更改，但需要启用 DO ...

在您的服务器上创建两个HTML文件......

的 TEST.HTM 的

<html> <head> <script> function reload_main() { window.main.location.href = "main.htm"; } </script> </head> <frameset rows="*,1" onLoad="reload_main()"> <frame src="blank.htm" name="main"> <frame src="css/" name="directory"> </frameset> </html>

的 main.htm中 的

<html> <body> <h1>Contents of directory</h1> <script> var links_length = parent.directory.window.document.links.length; var link = ""; for (var i = 0; i < links_length ; i++) { link = parent.directory.window.document.links[i].href; document.write( '<a href="'+link+'">'+link+'</a><br>' ); } </script> <p><a href="index.htm" target="_parent">Return</a> </body> </html>

这基本上会让你得到同样的东西，但是嵌入在一个看不见的iFrame中。但是，您仍然可以提取后续的<li><a href="baboon.png"> baboon.png</a></li>项并操纵XML以执行任何操作。

在不知道javascript名称的情况下，将所有xml文件加载到目录中

2 个答案: