473,725 Members | 2,278 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

document.getEle mentById fails when assigning return value to variable with same name as id?

I've got a piece of code where, for all the world, it looks like this
fails in IE 6:

hometab = document.getEle mentById('homet ab');

but this succeeds:

hometabemt = document.getEle mentById('homet ab');

Has anyone ever seen anything like this before, or am I dreaming?

(Both appear to work in firefox.)

Dec 29 '05 #1
20 6995
weston wrote:
I've got a piece of code where, for all the world, it looks like this
fails in IE 6:
hometab = document.getEle mentById('homet ab');


What do you mean it 'looks like this fails'?

Vague problem descriptions usually get vague responses :)

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Dec 29 '05 #2
Matt Kruse wrote:
What do you mean it 'looks like this fails'?
Vague problem descriptions usually get vague responses :)


On the contrary, that was a very specific request for clarification. :)
(And quite kind of you.)

I mean that the line:

hometab = document.getEle mentById('homet ab');

where the variable identifier is the same as the id given in the
document, apparently causes IE 6 to cease execution, and claim "Error:
Object doesn't support this property or method. Code: 0."

Meanwhile, the same line, with the identifier slightly changed:

hometabemt = document.getEle mentById('homet ab');

seems to work as expected.

You can examine the context for this observation at:
http://client.logoworks.com/ServiceTraction/

OR... you can try it on Jesse Ruderman's Javascript Shell. There's a
div on that page with id="output". So, visit using IE 6, and try
entering:

output = document.getEle mentById('outpu t')

It's fun. :)

Then try:

outputemt = document.getEle mentById('outpu t')

Dec 29 '05 #3
weston wrote:
I mean that the line:
hometab = document.getEle mentById('homet ab');
where the variable identifier is the same as the id given in the
document, apparently causes IE 6 to cease execution, and claim "Error:
Object doesn't support this property or method. Code: 0."


Ah, yes. In IE, objects with an ID cause that ID to become a global variable
referring to the object. One of the bad "shortcuts" that MS put into IE.

Global variables are usually to be avoided anyway. Use the 'var' keyword
inside a function to avoid the global reference and it works fine.
For example,

<html>
<head>
<title></title>
<script>
window.onload = function() {
var x = document.getEle mentById('x');
alert(x);
}
</script>
</head>
<body>

<div id="x"></div>

</body>
</html>

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Dec 29 '05 #4
On 2005-12-29, weston <no************ *************** ********@cannce ntral.org> wrote:
Matt Kruse wrote:
What do you mean it 'looks like this fails'?
Vague problem descriptions usually get vague responses :)


On the contrary, that was a very specific request for clarification. :)
(And quite kind of you.)

I mean that the line:

hometab = document.getEle mentById('homet ab');

where the variable identifier is the same as the id given in the
document, apparently causes IE 6 to cease execution, and claim "Error:
Object doesn't support this property or method. Code: 0."

Meanwhile, the same line, with the identifier slightly changed:

hometabemt = document.getEle mentById('homet ab');

seems to work as expected.


try this:

var hometab = document.getEle mentById('homet ab');

or do what I did in a different script.

try {hometab=docume nt.getElementBy Id('hometab');}
catch (q){;}

Bye.
Jasen
Dec 29 '05 #5
Matt Kruse wrote:
Ah, yes. In IE, objects with an ID cause that ID to become a global variable
referring to the object. One of the bad "shortcuts" that MS put into IE.


I'm still a bit confused. I do see that properly scoping the variable
as you're talking about fixes the problem. I just can't figure out for
the life of me why it being a global variable would prevent it from
receiving something via the assignment operator. Other global variables
can do that -- right?

Or is there some hidden magic here I"m not aware of...

Dec 30 '05 #6
weston said the following on 12/30/2005 5:11 PM:
Matt Kruse wrote:

Ah, yes. In IE, objects with an ID cause that ID to become a global variable
referring to the object. One of the bad "shortcuts" that MS put into IE.

I'm still a bit confused. I do see that properly scoping the variable
as you're talking about fixes the problem. I just can't figure out for
the life of me why it being a global variable would prevent it from
receiving something via the assignment operator. Other global variables
can do that -- right?

Or is there some hidden magic here I"m not aware of...


The hidden "magic" is that you are not referencing a *variable* when you
do it in IE, you are referencing the object itself.

myObject = document.getEle mentById('myObj ect')

In IE, when you do that, myObject is not a variable. It is a reference
to the container with ID of myObject.

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Dec 31 '05 #7
VK

weston wrote:
Matt Kruse wrote:
Ah, yes. In IE, objects with an ID cause that ID to become a global variable
referring to the object. One of the bad "shortcuts" that MS put into IE.


I'm still a bit confused. I do see that properly scoping the variable
as you're talking about fixes the problem. I just can't figure out for
the life of me why it being a global variable would prevent it from
receiving something via the assignment operator. Other global variables
can do that -- right?

Or is there some hidden magic here I"m not aware of...


There is no magic - just an incorrect explanation of the behavior.
Element ID's are not becoming global variables: but elements - with
"id" attribute set to something - are becoming named properties of the
global "window" object. And the "window" object is the default object
of the global execution context. You can consider your script code to
be in the form:

with (window) {
// your code
}

where with(window){} block is being applied seemlessly by the JScript
interpreter. So when meeting a literal on the left side of the
expression without the "var" qualifier, interpreter first looks for an
existing local variable with such name; if failed then it looks for a
global variable with such name; if failed then it looks for window
property with such name. If all above failed then new global variable
will be created.

Samples to play with in the next year:

<html>
<head>
<title>IE's scope 1</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<script type="text/jscript">
var foo = '';

function test(obj) {
foo = obj.innerText;
alert(foo);
}

</script>
</head>

<body>

<div id="foo" onclick="test(t his)" style="cursor:h and">bar</div>

</body>
</html>
<html>
<head>
<title>IE's scope 2</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<script type="text/jscript">
function test(obj) {
alert(foo.inner Text);
// same as:
alert(window.fo o.innerText);

alert(self); // '[object]'
// same as:
alert(window.se lf);
}

</script>
</head>

<body>

<div id="foo" onclick="test(t his)" style="cursor:h and">bar</div>

</body>
</html>

P.S. One of these "noises" VK does.

P.P.S. Happy New Year!

Dec 31 '05 #8
VK wrote:
There is no magic - just an incorrect explanation of the behavior.
Element ID's are not becoming global variables: but elements - with
"id" attribute set to something - are becoming named properties of the
global "window" object.


Uh, what do you think global variables are? They are properties of the
global object (window). One in the same.

x=5;
window.x=5;

They both do the same thing in a browser context.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Dec 31 '05 #9
VK

Matt Kruse wrote:
VK wrote:
There is no magic - just an incorrect explanation of the behavior.
Element ID's are not becoming global variables: but elements - with
"id" attribute set to something - are becoming named properties of the
global "window" object.


Uh, what do you think global variables are? They are properties of the
global object (window). One in the same.

x=5;
window.x=5;

They both do the same thing in a browser context.


I'm glad that the "noise" I'm making helped you to turn over the chair
you're sitting on ;-) The are not the same - but their visibility
scopes can be overlapped and the mechanics is rather difficult to
express in words - though rather easy to use. Next year problem, I
guess.

Try:

<html>
<head>
<title>IE's scope</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<script type="text/jscript">
// Comment and uncomment the declaration below.
// Watch how the results will change. For explanation
// remember that the whole script is running in the
// with (window) {...} block with you don't see but which
// is nevertheless here.
var foo = 'bar';

function test(obj) {
alert(foo);
alert(window['foo']);

}

</script>
</head>

<body>

<div id="foo" onclick="test(t his)" style="cursor:h and">bar</div>

</body>
</html>

Dec 31 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
6844
by: David List | last post by:
I'm having a problem using different properties of the document object in the example javascripts in my textbook with browsers that identify themselves as using the Mozilla engine. One example of these problems is using document.layers. I have Google'd for examples of how to use the document object specifically with Mozilla, but I cannot find anything that explains why my problems occur. Could anyone here see through the included example...
15
3243
by: lawrence | last post by:
Sorry for the dumb question but I'm new to Javascript. I wrote this script hoping to animate some div blocks on a page. You can see the page here: http://www.keymedia.biz/demo.htm Can anyone tell me why these DIVs don't drift to the left as they are supposed to? <script language="javascript">
8
8239
by: Phil Powell | last post by:
if (document.location.href.indexOf('?') >= 0) document.location.href = document.location.href.substring(0, document.location.href.indexOf('?')); if (document.location.href.indexOf('#') >= 0) { document.location.href = document.location.href.substring(0, document.location.href.indexOf('#')) + '?' + newUrl; } else { document.location.href = document.location.href + '?' + newUrl; }
14
4122
by: Eli | last post by:
I've got a script that I'm trying to debug which uses document.write() to place HTML within a page. In both IE6 and Firefox when I view source, I see only the script itself and not any HTML as it's being written into the page. Is there a way that I can view what is being placed into the page, instead of, or in addition to the javascript code?
3
9269
by: davidkarlsson74 | last post by:
Error: document.getElementById("folderMenu").cells has no properties File: http://www.volkswagen.se/tillbehor/js/foldermenu.js Rad: 49 The function activates different DIV:s, but doesn't seem to work on FireFox or Netscape. What could be wrong? The function: function setActiveTab(tabNo) {
6
10146
by: adamrfrench | last post by:
Let it be mentioned that Javascript is not my forte, so the solution to this could very well be a simple one. I am working on an AJAX function where I can pass a URL and the target ID in, and have the function update the target ID with the URL. There is a bit more to it then that, but that is the basics. my difficulty comes when I try to assign a variable to: "document.getElementById('-> var gose here <-').innerHTML"
4
6324
by: noddy | last post by:
I need to retrieve some notes from a database, allow users to modify them and then return them to the database.I have done this satisfactorily using php.However I would like to do it using AJAX. To this end I have a <divthe innerhtml for which is sent from a php file. The innerhtml constructs and fills a series of textareas and provides each with an id. When I want to return the modified note to the database and try to copy the text...
29
19277
by: Nick | last post by:
I've seen a few frameworks use the following: function $(id) { return document.getElementById(id); } Then to use: $('something').innerHTML = 'blah'; I'm just trying to roll this out to my site and so far doing this has saved about 8KB of javascript (lots of ajax/dynamic elements). I just
5
4012
by: ankit1999 | last post by:
I have a problem, everytime i'm run this page http://click2travel.in/index.php i get the this error,,,
0
8889
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
8752
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
8099
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6702
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6011
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4784
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
3228
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
2637
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2157
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.