News

Log In Sponsors
Partner Sites

HTML code to browse pages containing incrementing numbers



Problem: You want to browse a website which contains a number of html-files with the same pattern: The files are all named the same, except for a number, and the HTML-documents are not linked together. Example: http://devppl.chew.ch/page01.html http://devppl.chew.ch/page02.html .. and so on. I have written a small HTML-script to navigate through these pages: It contains of two files. 1) index.html (the frameset) 2) select.html (the form in the frame) You can simply put the two files into a (must be the same) folder of yours and doubleclick index.html. The bottom of the page should look like this: [img:5sco6e01]http://devppl.chew.ch/increment.jpg[/img:5sco6e01] Enter your required URL in the left field. The dynamic part of the URL is the string "CNG". That will be substituted by the current number. Enter the value of CNG in the field "current". With the buttons '<<' '>>' you can increment or de-increment the number and you will navigate through the website. With the button 'Open' you can open the content in a new browser-window. here is the code of index.html: [code:5sco6e01] <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/javascript"> <!-- function getURL () { var GETParam = document.URL.indexOf("??"); var newURL = "./select.html"; if (GETParam > 0) { newURL += "??" + document.URL.replace(/^.*\?\?/,""); } document.getElementById("selectFrame").setAttribute("src", newURL); } //--> </script> </head> <frameset name="counterSet" rows="*,55" frameborder="NO" border="0" framespacing="0" onload="getURL()"> <frame name="mainFrame"> <frame name="selectFrame" id="selectFrame"> </frameset> </html> [/code:5sco6e01] Here is the code of select.html: [code:5sco6e01] <html> <head> <script type="text/javascript"> <!-- function increment(n) { var link = document.leoform.link.value; var counter = document.leoform.current.value; var counterLength = counter.length; counter = Number(counter); counter = counter +n; var numberOfZeroes = counterLength - String(counter).length; if (numberOfZeroes > 0) { zeroString = String(Math.pow(10, numberOfZeroes)).replace(/^1/,""); counter = zeroString + String(counter); } document.leoform.current.value = counter; var new_link = link.replace(/CNG/g,document.leoform.current.value); parent.frames[0].location.href = new_link; } function openInWindow() { var link = document.leoform.link.value; var counter = document.leoform.current.value; var new_link = link.replace(/CNG/g,counter); window.open(new_link); } //--> </script> </head> <body> <form name="leoform"> <table width="1000"> <tr> <td width="517">link: <input name="link" type="text" size="70" maxlength="400" value=""></td> <td width="164">current: <input name="current" type="text" size="8" maxlength="20" value=0></td> <td width="196"> <input type="button" name="prev" value="<<" onClick="increment(-1);"><input type="button" name="next" value=">>" onClick="increment(1);"> string=CNG </td> <td width="103"> <input type="button" name="new" value="Open" onClick="openInWindow();"> </td> </tr> </table> </form> <script type="text/javascript"> <!-- var GETParam = document.URL.indexOf("??"); if (GETParam > 0) { document.leoform.link.value = document.URL.replace(/^.*\?\?/,""); } //--> </script> </body> </html> [/code:5sco6e01] By the way... you can also call the page 'index.html' with an argument: C:\my-drive\index.html??http://devppl.chew.ch/pageCNG.html -> the script keeps leading zeros :-) Cheers! - leonard

Click here to read the whole forum topic