Home Articles FAQs XREF Games Software Instant Books BBS About FOLDOC RFCs Feedback Sitemap
irt.Org

Related items

JavaScript Bookmarklets

Why bother with JavaScript?

JavaScript Games #2 - Solitaire

Writing a midi hifi system in JavaScript

JavaScript Beginners Start Here

Keeping Count of Downloads

JavaScript Games

Online JavaScript Resources

Automating the Previous and Next buttons

Automating NEW!

Reading the contents of a directory

You are here: irt.org | Articles | JavaScript | Miscellaneous | Reading the contents of a directory [ previous next ]

Published on: Thursday 17th April 1997 By: Martin Webb

This article will describe how it is possible to read the contents of a directory.

there are, however, certain limitations:

  1. It uses frames.
  2. It will not work if the directory contains an index.htm file, or anything similar that the server will return to the browser if you access the directory without specifying a filename.
  3. It is also possible for web servers to be configured so that they will refuse to return a directory listing.
  4. It does not work offline on Internet Explorer 3.0.

Apart from these limitations, it has plenty of potential.

The example I will demonstrate will use the following frame structure:



 
test.htm
 
 
main.htm
 
directory url


The test.htm document defines two frames:

<html>
<head>
<script language="JavaScript"><!--
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="../images/" name="directory">
</frameset>

</html>

The test.htm file loads a directory listing in the bottom directory frame (which in this example is the images directory on the irt.org we-site.)

The browser will actually create hypertext links to the individual files, which can then be subsequently examined using the JavaScript links array.

The reason this does not work in Internet Explorer, is that the browser does not create HTML hypertext links to the files.

To ensure that the directory frame is completely loaded, we use the onLoad() event in the FRAMESET to load the main.htm document into the main frame.

The contents of the main.htm file will then read the links array and will simply provide links to the files. This can then be easily adapted to display the data in any manner that you desire, e.g. tables, drop down menus, sorted by type, etc. The functionality of the main.htm can be enriched to provide, for example a picture browser, or a slide show. It removes the necessity to hardcode the contents of the directory within the JavaScript.

The contents of the main.htm document is as follows:

<html>
<body>
<h1>Contents of directory</h1>

<script language="JavaScript"><!--
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>

The JavaScript finds the length of the links array. Which it then uses to walk through the links array outputing the href property within an anchor.

Why not try out the example for yourself?

Related items

JavaScript Bookmarklets

Why bother with JavaScript?

JavaScript Games #2 - Solitaire

Writing a midi hifi system in JavaScript

JavaScript Beginners Start Here

Keeping Count of Downloads

JavaScript Games

Online JavaScript Resources

Automating the Previous and Next buttons

Automating NEW!

©2016 Martin Webb