Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.javascript > #21184

Re: getElementById or forms['form'].elements....?

From Ken <usenet-so@abdiassoftware.com>
Newsgroups comp.lang.javascript
Subject Re: getElementById or forms['form'].elements....?
Date 2013-09-07 13:58 -0500
Organization Abdias Software
Message-ID <l0ft2n$37u$1@speranza.aioe.org> (permalink)
References <k8im29d9ajaespd888g0se3fhhj589u4kg@4ax.com>

Show all headers | View raw


On 07.09.2013 10:45, Ed Jay wrote:
 > I'm being told to us the identifier:
 > document.getElementById("foo_box").whatever;
 >
 > instead of:
 > document.forms['form'].elements['foo_box'].whatever;
 >
 > Why?

It's faster and cleaner (ie. /mostly/ personal preference).

By using the forms approach the browser need to first traverse the 
document tree, then traverse the forms branch, then elements branch. By 
using getElementById the browser will internally look-up in an id list 
(same as used for the window object) which is faster.

That being said: Unless you have a ton of elements you need to look-up 
you won't notice any perfomance gain by switching. But it's probably 
easier to come back and read the code later if you simnplify it (again, 
personal preference).

You can use:

   document.forms['form'].elements['foo_box'].whatever;
   document.forms.form.foo_box.whatever;
   document.getElementById('form').foo_box.whatever;
   document.getElementById('foo_box').whatever;
   document.querySelector('#foo_box').whatever;  // the "new way"
   window.foo_box;

and even directly:

   foo_box.whatever;

Personally I use getElementById when an element has an id but I am 
switching more and more over to querySelector (which is a bit more 
powerful).


-- 
Ken Fyrstenberg
Abdias Software
http://abdiassoftware.com/
(remove usenet- from address)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread


Thread

getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-07 08:45 -0700
  Re: getElementById or forms['form'].elements....? Martin Honnen <mahotrash@yahoo.de> - 2013-09-07 18:07 +0200
    Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-07 10:36 -0700
  Re: getElementById or forms['form'].elements....? Ken <usenet-so@abdiassoftware.com> - 2013-09-07 13:58 -0500
    Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-07 13:18 -0700
      Re: getElementById or forms['form'].elements....? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-09-07 22:37 +0200
        Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-07 14:28 -0700
          Re: getElementById or forms['form'].elements....? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-09-08 08:59 +0200
            Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-08 06:55 -0700
              Re: getElementById or forms['form'].elements....? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-09-08 17:39 +0200
              Re: getElementById or forms['form'].elements....? Gregor Kofler <usenet@gregorkofler.com> - 2013-09-08 20:22 +0200
              Re: getElementById or forms['form'].elements....? Stefan Weiss <krewecherl@gmail.com> - 2013-09-09 04:35 +0200
                Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-08 22:05 -0700
                Re: getElementById or forms['form'].elements....? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-09-09 09:22 +0200
                Re: getElementById or forms['form'].elements....? Stefan Weiss <krewecherl@gmail.com> - 2013-09-09 13:50 +0200
      Re: getElementById or forms['form'].elements....? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-07 22:49 +0200
        Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-07 14:25 -0700
          Re: getElementById or forms['form'].elements....? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-08 01:44 +0200
            Re: getElementById or forms['form'].elements....? John Harris <niam@jghnorth.org.uk.invalid> - 2013-09-08 10:04 +0100
              Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-08 06:56 -0700
                Re: getElementById or forms['form'].elements....? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-08 19:25 +0200
                Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-08 12:23 -0700
              Re: getElementById or forms['form'].elements....? Dr J R Stockton <reply1300@merlyn.demon.co.uk.invalid> - 2013-09-09 19:56 +0100
                Re: getElementById or forms['form'].elements....? John Harris <niam@jghnorth.org.uk.invalid> - 2013-09-10 10:26 +0100
      Re: getElementById or forms['form'].elements....? Ken <usenet-so@abdiassoftware.com> - 2013-09-07 18:36 -0500
  Re: getElementById or forms['form'].elements....? Dr J R Stockton <reply1300@merlyn.demon.co.uk.invalid> - 2013-09-08 19:17 +0100
    Re: getElementById or forms['form'].elements....? Ed Jay <edMbj@aes-intl.com> - 2013-09-08 16:03 -0700

csiph-web