getElementById --- Why isn't it working? [Archive]

noleli2

2007-08-23, 08:44

There's probably something really simple that I'm missing, but...
I'm trying to access the elements with IDs "add" and "remove", and I'm told by Firefox's Javascript console that they have "no properties".

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
...snip...
<script src = "management.js" type = "text/javascript"></script>
</head>

<body>
<div id = "news" class = "tabContent">
<div id = "headline_list">
<table>
<tbody id = "headline_list_table"><tr><td></td></tr></tbody>
</table>
<span id = "add" class = "add_remove">+</span><span id = "remove" class = "add_remove">-</span>
</div>
<div id = "news_edit">
Headline: <input id = "headline" /><br />
Body: <textarea id = "body"></textarea><br />
<button id = "goButton">Go</button>
</div>
</div>
</body>
</html>

with the Javascript
document.onload = load();

function load()
{
document.getElementById("add").innerHTML = "test!";
}

Thanks in advance for pointing out my silliness! :)

noleli2

2007-08-23, 09:37

Got it.
document.onload = load(); should be window.onload = load;.

If I'm understanding it correctly, first of all, onload is not an event of the document object; it doesn't exist. Secondly, by adding the parentheses, I was assigning the return value of load() rather than registering it as the function to run when the onload event occurs.