Simplest getElementById question ever.

#1 July 23rd, 2005, 07:50 PM

Why isn't this working?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<script language="javascript">
alert(document.getElementById('pst'));
</script>
</head>

<body>
<div id="subjects">
<form action="" method="get">1. Would you like to
<div id="pst">
<a href="#">write a supporting opinion</a>, or <a href="#">write a
differing opinion</a>, or <a href="#">write a general comment</a>
</div>
<p id="subject_list"> </p>
</form>
</div>
</body>
</html>

It's killing me. Is there something obvious I'm missing? Thanks.

#2 July 23rd, 2005, 07:50 PM

The document has to load before you can reference document.getElementById;

wrap it in a function and call it onload:

<script language="javascript">
function saywhat(){
alert(document.getElementById('pst'));
}
onload=sayWhat;
</script>

#3 July 23rd, 2005, 07:50 PM

Rich Hephner wrote:
[color=blue]
> Why isn't this working?
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
> "http://www.w3.org/TR/html4/loose.dtd">
> <html>
> <head>
> <meta http-equiv="Content-Type" content="text/html;
> charset=iso-8859-1">
> <script language="javascript">
> alert(document.getElementById('pst'));
> </script>[/color]

The browser parses the document and executes script blocks while parsing
it so at this point when document.getElementById('pst') is called it
returns null as no element with that id attribute value is found. So the
example works as expected if you see an alert dialog with null.
Perhaps you want to use
window.onload = function (evt) {
alert(document.getElementById('pst'));
};

--

Martin Honnen
http://JavaScript.FAQTs.com/

#4 July 23rd, 2005, 07:50 PM

Rich Hephner wrote on 16 mei 2005 in comp.lang.javascript:
[color=blue]
> Why isn't this working?
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
> "http://www.w3.org/TR/html4/loose.dtd">
> <html>
> <head>
> <meta http-equiv="Content-Type" content="text/html;
> charset=iso-8859-1">
> <script language="javascript">
> alert(document.getElementById('pst'));
> </script>
> </head>
>
> <body>
> <div id="subjects">
> <form action="" method="get">1. Would you like to
> <div id="pst">
> <a href="#">write a supporting opinion</a>, or <a href="#">write a
> differing opinion</a>, or <a href="#">write a general comment</a>
> </div>
> <p id="subject_list"> </p>
> </form>
> </div>
> </body>
> </html>
>
> It's killing me. Is there something obvious I'm missing? Thanks.
>[/color]

1 the element does not yet exist at the time your alert is executed.

2 you probably don't want to show the element, but some writable property
of that element, like the tagNeme, some style element or the innerHTML.
IE would return [object] but other browsers could have other ideas.

--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

#5 July 23rd, 2005, 07:50 PM

Wow. Thanks. That's it. One more question though. How come if I create
an external js file like so:

function test(){
alert(document.getElementById('pst'));
}

if(document.getElementById && document.createTextNode){
window.onload = test();
}

and call it from the head of the first html file, it doesn't work?
Thanks.

#6 July 23rd, 2005, 07:50 PM

Rich Hephner wrote on 16 mei 2005 in comp.lang.javascript:[color=blue]
> Wow. Thanks. That's it.[/color]

It would be even better if you qoute the stuff you are replying on.

This is not email, nor a helpdesk service, but usenet, and thousands of
readers now and later the archive, don't know a thing of where you are
relying on.

One more question though. How come if I create[color=blue]
> an external js file like so:
>
> function test(){
> alert(document.getElementById('pst'));
>}
>
> if(document.getElementById && document.createTextNode){
> window.onload = test();
>}
>
> and call it from the head of the first html file, it doesn't work?
> Thanks.[/color]

The same answer would apply if the first was still in your quote.

Please keep to the Netiqutte.

--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

#7 July 23rd, 2005, 07:50 PM

Rich Hephner wrote:
[color=blue]
> How come if I create
> an external js file like so:
>
> function test(){
> alert(document.getElementById('pst'));
> }
>
> if(document.getElementById && document.createTextNode){
> window.onload = test();
> }
>
> and call it from the head of the first html file, it doesn't work?[/color]

Well it works, you declare a function named test and then you call it on
the right hand of the expression
window.onload = test();
then the function is called and executes
document.getElementById('pst')
which at that time does not find an element with that id and returns
null which is displayed.

What you probably want is
window.onload = test;
or
window.onload = function (evt) {
test();
}
--

Martin Honnen
http://JavaScript.FAQTs.com/

#8 July 23rd, 2005, 07:50 PM

--- quote --

Rich Hephner wrote:[color=blue]
> How come if I create
> an external js file like so:[/color]
[color=blue]
> function test(){
> alert(document.getElementById(*'pst'));
> }[/color]

[color=blue]
> if(document.getElementById && document.createTextNode){
> window.onload = test();
> }[/color]

[color=blue]
> and call it from the head of the first html file, it doesn't work?[/color]

Well it works, you declare a function named test and then you call it
on
the right hand of the expression
window.onload = test();
then the function is called and executes
document.getElementById('pst')
which at that time does not find an element with that id and returns
null which is displayed.

What you probably want is
window.onload = test;
or
window.onload = function (evt) {
test();
}
-- end quote --

Thank you Martin. That's what I needed to here. I'm a long time
javascript programmer, but am just now starting to take full advantage
of the new DOM. Thanks for your patience and your help.

#9 July 23rd, 2005, 07:50 PM

>Rich Hephner wrote on 16 mei 2005 in comp.lang.javascript:

[color=blue][color=green]
>> Wow. Thanks. That's it.[/color][/color]

[color=blue]
>It would be even better if you qoute the stuff you are replying on.[/color]
[color=blue]
>This is not email, nor a helpdesk service, but usenet, and thousands[/color]
of[color=blue]
>readers now and later the archive, don't know a thing of where you are[/color]
[color=blue]
>relying on.[/color]

[color=blue][color=green]
>>One more question though. How come if I create
>>an external js file like so:[/color][/color]
[color=blue][color=green]
>>function test(){
>> alert(document.getElementById(*'pst'));
>>}[/color][/color]

[color=blue][color=green]
>> if(document.getElementById && document.createTextNode){
>> window.onload = test();
>>}[/color][/color]

[color=blue][color=green]
>> and call it from the head of the first html file, it doesn't work?
>> Thanks.[/color][/color]

[color=blue]
>The same answer would apply if the first was still in your quote.[/color]
[color=blue]
>Please keep to the Netiqutte.[/color]

[color=blue]
>--
>Evertjan.
>The Netherlands.
>(Replace all crosses with dots in my emailaddress)[/color]

Thanks for the scolding. I'm using Google groups for posting because
that's all I have access to at my current location. They don't make it
easy to quote from past postings. I'm well aware of the Netiquette.

#10 July 23rd, 2005, 07:50 PM

Rich Hephner wrote on 16 mei 2005 in comp.lang.javascript:[color=blue]
> Thanks for the scolding. I'm using Google groups for posting because
> that's all I have access to at my current location. They don't make it
> easy to quote from past postings. I'm well aware of the Netiquette.[/color]

Is that a compelling argument not to do your utmost?

I am told it is quite possible.

--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

#11 July 23rd, 2005, 07:52 PM

JRS: In article <1116271019.704443.151500@z14g2000cwz.googlegroups .com>
, dated Mon, 16 May 2005 12:16:59, seen in news:comp.lang.javascript,
Rich Hephner <otto95@pegasi.net> posted :[color=blue]
>
>Thanks for the scolding. I'm using Google groups for posting because
>that's all I have access to at my current location. They don't make it
>easy to quote from past postings. I'm well aware of the Netiquette.[/color]

The way to get correct quoting is posted in this group often enough :

For proper quoting when using Google for News :-
Keith Thompson wrote in comp.lang.c, message ID
<lnwtuhfy7d.fsf@nuthaus.mib.org> :-
If you want to post a followup via groups.google.com, don't use
the "Reply" link at the bottom of the article. Click on "show options"
at the top of the article, then click on the "Reply" at the bottom of
the article headers.

It should be a <FAQENTRY> by now.

I don't know whether that gives correct attributions, but it's easy
enough to type or copy'n'paste something in.

If you're "well aware of the Netiquette", why do you over-quote?

--
© John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 MIME ©
Web <URL:http://www.uwasa.fi/~ts/http/tsfaq.html> -> Timo Salmi: Usenet Q&A.
Web <URL:http://www.merlyn.demon.co.uk/news-use.htm> : about usage of News.
No Encoding. Quotes before replies. Snip well. Write clearly. Don't Mail News.

Simplest getElementById question ever.

Popular Articles

What is Bytes?