Set document.getElementById to variable

javascript variables getelementbyid
Bret Thomas picture Bret Thomas · Mar 21, 2012 · Viewed 9.2k times · Source

The following works:

    $ = document.form;
    x = $.name.value;

This doesn't:

    $ = document.getElementById;
    x = $("id").value;

Any ideas on why this doesn't work or how to make it so?

Answer

Quentin picture Quentin · Mar 21, 2012

The value of this depends on how you call the function.

When you call document.getElementById then getElementById gets this === document. When you copy getElementById to a different variable and then call it as $ then this === window (because window is the default variable).

This then causes it to look for the id in the window object instead of in the document object, and that fails horribly because windows aren't documents and don't have the same methods.

You need to maintain the document in the call. You can use a wrapper functions for this e.g.

function $ (id) { return document.getElementById(id); }

… but please don't use $. It is a horrible name. It has no meaning and it will confuse people who see it and think "Ah! I know jQuery!" or "Ah! I know Prototype" or etc etc.

Related questions

How can I determine if a variable is 'undefined' or 'null'?

How do I determine if variable is undefined or null? My code is as follows: var EmpName = $("div#esd-names div#name").attr('class'); if(EmpName == 'undefined'){ // DO SOMETHING }; <div id="esd-names"> <div id="name"></div&…

Read More
JavaScript check if variable exists (is defined/initialized)

Which method of checking if a variable has been initialized is better/correct? (Assuming the variable could hold anything (string, int, object, function, etc.)) if (elem) { // or !elem or if (typeof(elem) !== 'undefined') { or if (elem != null) {

Read More
How do JavaScript closures work?

How would you explain JavaScript closures to someone with a knowledge of the concepts they consist of (for example functions, variables and the like), but does not understand closures themselves? I have seen the Scheme example given on Wikipedia, but …

Read More