views:

548

answers:

1

I've two html files. One includes the other in an iframe. The iframe executes a getElementById on a previously created element. This works fine in Chrome/Safari but doesn't in Firefox/IE8, and I don't understand why.

Firefox returns: null

Safari returns: [object HTMLDivElement]

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"&gt;

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
</head>
<body>
    <iframe src="comment.html"></iframe>
</body>
</html>

comment.html

<div id="foobar"></div>
<script type="text/javascript">
    alert(document.getElementById('foobar'));
</script>
+2  A: 

Your comment html file is not properly formed. Try using:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"&gt;

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
</head>
<body>
<div id="foobar"></div>
<script type="text/javascript">
    alert(document.getElementById('foobar'));
</script>

</body>
</html>
meouw
That works. I totally forgot that documents loaded in the iframe must be proper HTML documents (with doctype etc.). Thanks!
ak