JavaScript Games #2 - Solitaire
Writing a midi hifi system in JavaScript
JavaScript Beginners Start Here
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:
Apart from these limitations, it has plenty of potential.
The example I will demonstrate will use the following frame structure:
|
test.htm
|
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?
JavaScript Games #2 - Solitaire
Writing a midi hifi system in JavaScript
JavaScript Beginners Start Here
Automating the Previous and Next buttons