getAttribute Returns [object Window] Instead of Value

Question

I am writing out a hierarchical set of elements to the DOM document using JavaScript and am debugging using FireBug on FireFox 20.0. Based upon what I see when examining the DOM using FireBug, it seems that the writing out is going fine. The part of interest has the following structure.

childNodes NodeList[ulcorner, lrcorner]
- 0 ulcorner    
    accessKey  ""
    accessKeyLabel""
    - attributes    [xcoord="134", ycoord="49"]
    + 0 xcoord="134"
    + 1 ycoord="49"

However, when I call

var ulCorner=upperElement.getElementsByTagName("ulCorner")[0];
top=ulCorner.getAttribute("yCoord");
left=ulCorner.getAttribute("xCoord");
console.log('top=' + top + ', left=' + left);

I get

top=[object Window], left=134

Why is top set to [object Window] instead of 49?

I am generating the DOM tree programatically. There is no XML file involved. AFAIK there is no way to output the tree structure to a file using JavaScript since it is a client side language. Thanks, Peter. — OtagoHarbour
– OtagoHarbour, Commented Apr 9, 2013 at 18:52
Oh, why do you use XML then instead of plain JS objects? However, you can stringify a DOM to XML by using a XMLSerializer, see developer.mozilla.org/en-US/docs/Parsing_and_serializing_XML — Bergi
– Bergi, Commented Apr 9, 2013 at 18:54
Thanks. I will look into that. I would like to be able to output my DOM documents to XML files but thought that I needed to use PHP, or maybe Java, for that. I did not think I could do it with JavaScript. Thanks again, Peter. — OtagoHarbour
– OtagoHarbour, Commented Apr 9, 2013 at 19:35

plalx · Accepted Answer · 2013-04-09 18:58:06Z

4

top is an existing property on the window object and it's non-writable https://developer.mozilla.org/fr/docs/DOM/window.top

var ulCorner=upperElement.getElementsByTagName("ulCorner")[0];
var top=ulCorner.getAttribute("yCoord");
var left=ulCorner.getAttribute("xCoord");
console.log('top=' + top + ', left=' + left);

The above should work, however it's not recommended to shadow existing global variables and I strongly advise you to select another variable name, unless your code doesn't run in the global scope.

edited Apr 9, 2013 at 18:58

answered Apr 9, 2013 at 18:51

plalx

43.8k7 gold badges77 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

OtagoHarbour Over a year ago

That was my problem. I changed the variable to a different name and that fixed the problem. I found that putting var before top, to make the variable local, also fixed the problem. Thanks very much!

Bergi · Accepted Answer · 2013-04-09 18:51:26Z

1

top=ulCorner.getAttribute("yCoord");

You are creating an implicitly (and accidently) global variable here, i.e a property of the global object. The global object is window in browsers, and window.top is a non-writable "reference to the topmost window in the window hierarchy". So your assignment has no effect, and it just returns the top window (whose stringification is "[object Window]").

To fix this, just add the var keyword:

var ulCorner=upperElement.getElementsByTagName("ulCorner")[0];
var top=ulCorner.getAttribute("yCoord");
var left=ulCorner.getAttribute("xCoord");

or use a multiple var-statement:

var ulCorner=upperElement.getElementsByTagName("ulCorner")[0],
    top=ulCorner.getAttribute("yCoord"),
    left=ulCorner.getAttribute("xCoord");

answered Apr 9, 2013 at 18:51

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

1 Comment

OtagoHarbour Over a year ago

Yes indeed! That was the problem. I forgot to make the variable local by prepending var or using a non-reserved variable name. Thanks very much!

Collectives™ on Stack Overflow

getAttribute Returns [object Window] Instead of Value

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related