getElementById IE7 Issue

As previously stated, I’m taking some time to learn pure JavaScript. That means I am beginning to experience the joy that is cross-browser JS quirks!

I recently came across a simple issue: IE7 was throwing the following error for getElementById:

Object Doesn’t Support this Property or Method

In my head I was thinking: “What the heck IE? getElementById is the MAIN THING you should get right!”. The code was as following:

	<script type="text/javascript">
		window.onload = function()
		{
			var d = document;
			block = d.getElementById('block');
			var windowHeight = window.innerHeight || document.documentElement.clientHeight;

			var blockHeight = block.clientHeight;
			var offset = block.offsetTop;
			block.style.top = windowHeight - (offset + blockHeight) + 'px';
		};

	</script>

The Solution

It seems that I somehow forgot to include “var” before the assignment of “blocks” on line 5. Including “var” fixed the problem in IE7!

	<script type="text/javascript">
		window.onload = function()
		{
			var d = document;
			var block = d.getElementById('block');
			var windowHeight = window.innerHeight || document.documentElement.clientHeight;

			var blockHeight = block.clientHeight;
			var offset = block.offsetTop;
			block.style.top = windowHeight - (offset + blockHeight) + 'px';
		};

	</script>

Man…what have I gotten myself into?

$("joseph").hide();

Related Posts:

• Avoiding the AJAX New Line Pitfall