appendChild question

[williamwdoyle]

I am trying to move away from inline JavaScript to more unobtrusive javascript techniques. As a result, I want to do something in a outside script tied to an ID in my XHTML document, but i just can't get it to work. What I have done is created a date script in a seperate file like so:


var now = new Date();
var a = now.getDay();
var b = now.getDate();
var c = now.getMonth();
var d = now.getYear();

var dayArray = new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
var monthArray = new Array ('January','February','March','April','May','June','July','August','September','October','November', 'December');
d += 1900;


then i use document.write in the document to add it like so


<p id="dated">
<script type="text/javascript">
document.write (dayArray[a]+', '+monthArray[c]+' '+b+', '+d);
</script>
</p>


but what I want to do instead of using the document.write method is use something compliant with an XML parser. so i took out the document.write and added this to my separate script:


var j = dayArray[a] + ', ' + monthArray[c] + b + ', ' + d;

window.onload = function(){
var dateElement = document.getElementById('dated');
var dDate = document.creatTextNode(j);
dateElement.appendChild(dDate);
}

however, this doesn't seem to work for me. I have read numerous examples on "unobtrusive" javascript, but am having trouble changing from inline scripting. can someone help me here?

i really appreciate your help in advance.

william doyle

[hemebond]

Link please.

[williamwdoyle]

okay, i posted an example to my web site, but i put everything in one html document for ease. normally, i would link to a .js file with the script in it. if you look at the source you can see that i got the date to appear with the document.write method, but that the appendChild() DOM method isn't working for me.....

http://www.williamwdoyle.com/dated/something.html

[Harry Armadillo]

You mis-typed createTextNode. d+=1900 is unnecessary -- use getFullYear().

[williamwdoyle]

fixed the misspelling and it still doesn't work

[Harry Armadillo]

And
<p id="date">
versus
var dateElmnt = document.getElementById('dated');

[jscheuer1]

Well, I've never done this kind of programming before so I figured I'd learn something. I did, and have your script working. The trouble was with this function:

window.onload = function(){
var dateElmnt = document.getElementById('dated');
var dDate = document.creatTextNode(j);
dateElmnt.appendChild(dDate);
}When I Googled the red part to see what it was, I found it was misspelled, should be:

createTextNode

After that minor change, I made a division on the page with the id 'dated' like:

<div id="dated"></div>and was off to the races. (Er, that means it worked.)

[williamwdoyle]

i feel like a heel....

i need to troubleshoot my scripts more carefully....

thanks... got it working

[jscheuer1]

Well, I didn't stop with just seeing about the spelling. I read on after my last post and discovered that if, I rewrote your function like this:

window.onload = function(){
var mybody=document.getElementsByTagName("body").item(0);
var dateElmnt = document.createElement('div');
var dDate = document.createTextNode(j);
mybody.appendChild(dateElmnt)
dateElmnt.appendChild(dDate);
}I didn't even need a division with any particular id on the page, or any division at all, I had created one from whole cloth. This is neat stuff.

[williamwdoyle]

yes.... that is definitely a possibility, but the reason that i appended it to an existent paragraph element was beacause i also had class stylings applied to it as well, and rather than also add class declarations via the DOM it was easier to find the exact element and append the child element, but i am glad you learned something from this. so did i.... it is the first javascript routine i have written in two years (thank goodness for a more widely supported DOM).