Syntax to access div by ID.

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
3 messages Options
Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Syntax to access div by ID.

Gautam Sathe
Bit of a preamble:

Just got out of a really long argument with one of the developers
working for me about what I perceived as a syntax error... we made a
test page to settle the argument and I wound up feeling like I have no
clue about JS/Web development in general.

So here's what we argued about:

He has some HTML in a page which looks a bit like this:

<div id="testDiv">...</div>

In a script section he was trying to set its display property to 'none'
and he had coded it like:

testDiv.style.display = 'none';

This is a simplification of the actual code- but works for the sake of
testing/demonstrating what actually happened.

I argued and told him that the syntax is incorrect, that since the ID is
an HTML entity he cannot reference it directly in JS and that this would
generate errors. I told him to use either
    document.getElementById('testDiv').style.display='none'
or else (since we are using jQuery)
    $('#testDiv').hide()

Well, to cut a long story short - he argued back in defense of his code
and on testing we found that his syntax just "works" - tried Chrome,
Firefox... this has me really confused.

Has this always worked? Is it supposed to work this way? Are there any
drawbacks to this approach? Does anyone know of any current OS/Browser
combination where this would NOT work?

I can see a lot of our libraries shrinking a bit in size if we can
eliminate the needless syntax.
--
Confused

Disclaimer

  The information contained in this communication is intended solely for the
  use of the individual or entity to whom it is addressed and others
  authorized to receive it. It may contain confidential or legally
  privileged information. If you are not the intended recipient you are
  hereby notified that any disclosure, copying, distribution or taking any
  action in reliance on the contents of this information is strictly
  prohibited and may be unlawful. If you have received this communication
  in error, please notify us immediately by responding to this email and
  then delete it from your system. The company is neither liable for the
  proper and complete transmission of the information contained in this
  communication nor for any delay in its receipt.



Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Syntax to access div by ID.

Patrick H. Lauke
On 11/10/2012 13:05, Gautam Sathe wrote:
[...]
> <div id="testDiv">...</div>
>
> In a script section he was trying to set its display property to 'none'
> and he had coded it like:
>
> testDiv.style.display = 'none';
[...]

I seem to remember this was something IE did first, and other browsers
have adopted the behavior for compatibility reasons. It may actually now
be standardised somewhere in HTML5/Living Standard.

P
--
Patrick H. Lauke
______________________________________________________________
re·dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]

www.splintered.co.uk | www.photographia.co.uk
http://redux.deviantart.com | http://flickr.com/photos/redux/
______________________________________________________________
twitter: @patrick_h_lauke | skype: patrick_h_lauke
______________________________________________________________

Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Syntax to access div by ID.

Patrick H. Lauke
On 12/10/2012 14:21, Patrick H. Lauke wrote:

> On 11/10/2012 13:05, Gautam Sathe wrote:
> [...]
>> <div id="testDiv">...</div>
>>
>> In a script section he was trying to set its display property to 'none'
>> and he had coded it like:
>>
>> testDiv.style.display = 'none';
> [...]
>
> I seem to remember this was something IE did first, and other browsers
> have adopted the behavior for compatibility reasons. It may actually now
> be standardised somewhere in HTML5/Living Standard.

And I'm told it may have issues in browsers like older versions of
Firefox when the page is not in quirks mode...so worth testing.

Personally, I'd still use getElementById purely for clarity. It's not
like those few bytes will make a whole lot of impact on code size, IMHO.

P
--
Patrick H. Lauke
______________________________________________________________
re·dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]

www.splintered.co.uk | www.photographia.co.uk
http://redux.deviantart.com | http://flickr.com/photos/redux/
______________________________________________________________
twitter: @patrick_h_lauke | skype: patrick_h_lauke
______________________________________________________________

Loading...