Forum Moderators: open
(http://www.clmitchell.net/Bible/index.html).
The goals of the project are:
1)To use a single, dynamically-updated (js) web page (XHTML) to present all the books of the Bible, one chapter at a time.
2)To render the actual text of each chapter from an XML file existing on the web dir on the server (i.e., Genesis is a single XML file with 50 chapters).
3)To Use javascript to update the web page depending on the choice of the user (i.e., i dont want to have a single, HUGE js file with all possible pages in it; but would rather CALL other javascript files from a single MAIN js file [i've already achieved some success so far].
what is working NOW is:
1)user presses a button on main web page.
2)button calls MAIN js file/function requesting a particular "page" rendering.
3)using a switch/case block, the appropriate js file is called by dynamically adding a <script> tag to the <head> tag that calls the requested script that will render the proper page.
Here is the script that runs when user presses button:
*********************************
// functions to load 'pages' when the user requests them
//establish browser id variables
var IE6 = document.all;
var NS6 = document.getElementById;
//load the page requested by the user
function BLoad(Page){
//clear the Home Window contents
clearDiv();
//what is the requested page?
//call the appropriate script
switch(Page){
case 'OT': loadit('code/writeOT.js');break; // Old Testament
case 'NT': loadit('code/writeNT.js'); break; // New Testament
}
}
// clear <div> for new page
function clearDiv(){
if (IE6)document.all['DataTab'].innerHTML = '';
if (NS6)document.getElementById('DataTab').innerHTML = '';
}
function loadit(Script) {
if( document.createElement && document.childNodes ) {
var scriptElem = document.createElement('script');
scriptElem.setAttribute('language','JavaScript');
scriptElem.setAttribute('src',Script);
scriptElem.setAttribute('type','text/javascript');
document.getElementsByTagName('head')[0].appendChild(scriptElem);
}
}
*********************************
the dynamically-load script ("writeOT.js") seems to be running, but nothing is being added to the div.
There's no need to SHOUT, by the way.
My Colleague Bernard Marx (in another thread) suggest that i change--
document.getElementsById('tdr3a'+j)[0].appendChild(tr3tdimg[j]);
into--
document.getElementsById('tdr3a'+j).appendChild(tr3tdimg[j]);
so i tried the same thing with a getElementsByTagName() statement in bload.js...
...yet when i did that i got the the following msg from the NS7.2 JavaScript Console:
********************************
Error: document.getElementsByTagName("head").appendChild is not a function
Source File: file:///E:/newweb/Bible/code/bload.js
Line: 31
********************************
Does anyone know why this is happening?
document.getElementsByTagName("head") returns an array of elements. You can't append things to an array.
I've discovered something else:
in the dynamically loaded writeOT.js i placed at the beginning of the main function (writeOT()) the following:
alert("writeOT() is running.");
and at the end i placed:
alert("writeOT() has run.");
neither of these alerts were called!
I created the link to writeOT.js, but didn't call it from the updated page.
So the aforementioned script i changed--
case 'OT': loadit('code/writeOT.js'); break; // Old Testament
into--
case 'OT': loadit('code/writeOT.js','writeOT();'); break; // Old Testament
and rewrote loadit() thus:
*****************************
function loadit(Script,func) {
if( document.createElement && document.childNodes ) {
var scriptElem = document.createElement('script');
scriptElem.setAttribute('language','JavaScript');
scriptElem.setAttribute('src',Script);
scriptElem.setAttribute('type','text/javascript');
document.getElementsByTagName('head')[0].appendChild(scriptElem);
document.getElementById('DataTab').setAttribute('onmouseover',func);
}
}
*****************************
when the mouse is moved over the div, the writeOT() is now called!
That being said, i dont want the user to have to move the mouse over the div...so i must find an event (like onload) to trigger the call and then trigger the event from within loadit();
How then do i SEND a command to the div to trigger the onload event?
document.getElementById // <-- no 's'!-------------
document.getElementsById doesn't exist.
(but getElementsByTagName does)
