Hieronder staat een tabel met daarin een overzicht van de (inline-)frames in deze website. Dat wil zeggen: als je hier bent gekomen door "netjes" via de voordeur binnen te treden. De HTML-sectie van deze site kan nl. ook worden benaderd door een achterdeurtje. Maar dan zijn er geen (inline-)frames! In plaats van een lijst met (inline-)frames komt er dan een melding dat er geen (inline-)frames zijn.
De truc zit in een stukje JavaScript, dat kijkt hoeveel (inline-)frames er in het huidige document aanwezig zijn. Aan de hand van deze test wordt de benodigde HTML-code door het script geschreven.
Hier staat beschreven hoe je dit aanpakt.
De code staat aan het einde van deze bladzijde. Je kunt hem ook downloaden.
- De tabel wordt opgezet met de gewone <table>-tags.
- Voor het tabel-hoofd zijn <caption>-tags gebruikt.
- Het "veranderlijke" deel van de tabel wordt gemaakt door een JavaScriptje.
Dit werkt als volgt: - Het aantal frames in de parent van de huidige bladzijde wordt vastgelegd in de variabele waarde.
De parent is hier de bladzijde waarin de (inline-)frames zijn vastgelegd. Als je gewoon frames zou gebruiken in plaats van parent.frames, wordt waarde altijd gelijk aan nul. - Aan de hand van waarde wordt beslist welke volgende tabel-regels er worden gemaakt. Als waarde == 0 dan
wordt er een cel gemaakt met de melding "Geen (inline-)frames op deze site!", anders worden er evenveel regels gemaakt
als er (inline-)frames zijn, met daarin het volgnummer en de naam.
In het laatste geval wordt ook het totaal weergegeven. - De opdrachten worden naar de pagina geschreven met document.write. Bij het uitschrijven van de eind-tags(</td>
en </tr>) wordt voor de slash een backslash gezet. Hiermee geef je aan dat de slash moet worden weggeschreven,
en niet moet worden geïnterpreteerd. Wanneer de JavaScript-processor de combinatie </ tegenkomt, wordt dit behandeld
als een </script>-tag en wordt het script afgesloten.
De backslash is een "escape-code". Zie het item "Werken met strings".
- Zet het script in de <BODY> op de plaats waar je de tabel wilt hebben.
<table border="1" width="50%" cellspacing="2" cellpadding="5"
align="center">
<caption>Overzicht van de (inline-)frames op deze site</caption>
<script>
// HTML Genereren met JavaScript. Voorbeeld uit Ben's Hobbyhoekje
// (c) 2001-2022 Ben Boukes, mag vrij worden gebruikt.
var aantal = parent.frames.length;
if (aantal == 0) {
document.write('<tr><td align="center">Geen (inline-)frames op deze site!
<\ /td><\ /tr>')
} else {
for (i=0;i<aantal;i++) {
document.write('<tr align="center"><td>'+i+
'<\ /td><td>'+parent.frames[i].name+'<\ /td><\ /tr>');
}
document.write('<tr><td colspan="2" align="center">Totaal '+aantal+'
(inline-)frames.<\ /td><\ /tr>');
}
</script>
</table>
In het JavaScript bevat elke regel één opdracht, om problemen met het afbreken van strings te voorkomen. Op het scherm kan dat er anders uit zien, omdat de browser zelf regels afbreekt.
Downloaden:
Druk op de knop:
File: voorb029.zip, 585 bytes.
Opmerking:
Het is in dit script niet nodig om de aanhalingstekens te voorzien van een escape-karakter, omdat er geen misverstand mogelijk is.
