Hi,
I am new here and have not yet played with AJAX.
I am PC programmer who has migrated net based software such as DHTML, PHP MySQL etc.
I am interested in creating custom 'Web 2.0' web sites but I don't want to be tied into the limitations of a particular package such as AJAX.
I tried the code below and it is functional but I have some issues with it.
1) 'id' is not a valid DOM property of 'script' I was thinking of doing things this way myself but I want to stay within the DOM so as not to have compatibility issues.
2) CreateElement and AppendChild may not work as expected.
You can create an element and then there is a need to AppendChild.
Does RemoveChild actually DELETE the element or just remove it association with it's parent?
I suspect that RemoveChild only removes the association and not the actual element. This would result in ever growing resources being consumed on the client as more dynamic content has been transferred?
Having said that,I will play with this code until I get the results I want.
I was intending to have the head.script element in the original HTML and just change the src attribute.
For data in the other direction client>>server, I was playing with events dynamically linking to
<img src="SomePhpScriptThatOutputsAnImage.jpg?mydata=09902183">
OR
<script src="PhpUpdateData.js?mydata=887382">
OR
<script src="PhpUpdateData.PHP?mydata=887382">
It seems that browsers don't care what the extension is as long as the server sends back the correct header.
One tool I would like to have is a debugging script that shows all active nodes on the current document.
This would help me in those tricky instances where there are two <head> elements in one document.
Was anyone seen such a script of do I have to write it from scratch?
Thanks, Rob.
The scripts I used for testing -
--------------------------------
Filename testjs.htm
<html>
<head>
</head>
<body>
<script>
function test1(){
var script = document.createElement('script');
script.src = 'servertest1.js';
script.type = 'text/javascript';
script.defer = true;
var head = document.getElementsByTagName('head').item(0);
head.appendChild(script);
}
function test2(){
var script = document.createElement('script');
script.src = 'servertest2.js';
script.type = 'text/javascript';
script.defer = true;
var head = document.getElementsByTagName('head').item(0);
head.appendChild(script);
}
</script>
<span onmouseover="test1();">(Test 1) Mouse over here</span>
<span onmouseover="test2();">(Test 2) Mouse over here</span>
</body>
</html>
--------------------------------
Filename servertest1.js
alert('Hello client, I am server(1)');
--------------------------------
Filename servertest2.js
alert('Hello client, I am server(2)');
----------------------
Original code.
var script = document.createElement('script');
script.src = 'server.js';
script.type = 'text/javascript';
script.defer = true;
var head = document.getElementsByTagName('head').item(0);
head.appendChild(script);
var head = document.getElementsByTagName('head').item(0);
script.id = 'lastLoadedCommands';
var old = document.getElementById('lastLoadedCommands');
if (old) head.removeChild(script');