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

Groups > comp.lang.javascript > #33140 > unrolled thread

A generic question

Back to article view | Back to comp.lang.javascript

Contents

  A generic question justaguy <lichunshen84@gmail.com> - 2017-04-29 09:56 -0700
    Re: A generic question JJ <jj4public@vfemail.net> - 2017-04-30 07:59 +0700
      Re: A generic question justaguy <lichunshen84@gmail.com> - 2017-04-29 19:21 -0700
      Re: A generic question Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-04-30 20:16 +0200
        Re: A generic question Frank Kozuschnik <franko@nurfuerspam.de> - 2017-04-30 22:53 +0200
          Legacy properties on Window objects (was: A generic question) Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-05-01 06:10 +0200
          Re: A generic question JJ <jj4public@vfemail.net> - 2017-05-01 18:14 +0700
            Re: A generic question Frank Kozuschnik <franko@nurfuerspam.de> - 2017-05-01 18:07 +0200
    A generic question Ram Tobolski <ramtob@gmail.com> - 2017-04-30 08:01 -0700
      Re: A generic question justaguy <lichunshen84@gmail.com> - 2017-04-30 18:52 -0700

#33140 — A generic question

I know there are at least three methods to identify or reference an object in DOM, namely, 
(a) by id or name etc.  for instance, getElementById() or getElementsByName or getElementsByTagName;
(b) by relationship, for instance, parentNode
(c) by class, for instance, document.getElementsByClassName

Just curious if there's additional method to achieve the same.  

Thanks.

[toc] | [next] | [standalone]

#33145

On Sat, 29 Apr 2017 09:56:13 -0700 (PDT), justaguy wrote:
> I know there are at least three methods to identify or reference an object in DOM, namely, 
> (a) by id or name etc.  for instance, getElementById() or getElementsByName or getElementsByTagName;
> (b) by relationship, for instance, parentNode
> (c) by class, for instance, document.getElementsByClassName
> 
> Just curious if there's additional method to achieve the same.  
> 
> Thanks.

If a HTML element has an ID, it can be referenced from the global object or
the `window` object. e.g. for this element:

    <div id="theDiv"></div>

It can be accessed like below:

    <script>
      (function() {
        var ele;
        //from the `window` object...
        ele = window.theDiv;
        //from the global object...
        //assuming there's no local variable called `theDiv`
        ele = theDiv;
      })();
    </script>

[toc] | [prev] | [next] | [standalone]

#33146

On Saturday, April 29, 2017 at 8:59:11 PM UTC-4, JJ wrote:
> On Sat, 29 Apr 2017 09:56:13 -0700 (PDT), justaguy wrote:
> > I know there are at least three methods to identify or reference an object in DOM, namely, 
> > (a) by id or name etc.  for instance, getElementById() or getElementsByName or getElementsByTagName;
> > (b) by relationship, for instance, parentNode
> > (c) by class, for instance, document.getElementsByClassName
> > 
> > Just curious if there's additional method to achieve the same.  
> > 
> > Thanks.
> 
> If a HTML element has an ID, it can be referenced from the global object or
> the `window` object. e.g. for this element:
> 
>     <div id="theDiv"></div>
> 
> It can be accessed like below:
> 
>     <script>
>       (function() {
>         var ele;
>         //from the `window` object...
>         ele = window.theDiv;
>         //from the global object...
>         //assuming there's no local variable called `theDiv`
>         ele = theDiv;
>       })();
>     </script>

Great. If we make such id all CAPS and we don't name local var with all CAPS, say, we name 
 <div id="theDiv"></div>
as
 <div id="THEDIV"></div>

Then,
we may express it like this:
var ele;
if (window.THEDIV)
  ele = window.THEDIV;
else
  ele = THEDIV;

And it's interesting to see that it return the object and its value in its entirety.

Many thanks.

[toc] | [prev] | [next] | [standalone]

#33149

JJ wrote:

> If a HTML element has an ID, it can be referenced from the global object
> or the `window` object.

… in Quirks Mode only, as this is a legacy feature.  Do not use it.

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#33150

Thomas 'PointedEars' Lahn:

> JJ:
> 
>> If a HTML element has an ID, it can be referenced from the global
>> object or the `window` object.
> 
> … in Quirks Mode only, as this is a legacy feature.

Which browser would nowadays support this "feature" in quirks mode only? 
Even Firefox started polluting the global object in standards mode some 
years ago.

https://www.w3.org/Bugs/Public/show_bug.cgi?id=11960#c27

> Do not use it.

I agree. So does the HTML spec, but nevertheless the spec seems to 
require it:

https://html.spec.whatwg.org/#named-access-on-the-window-object

[toc] | [prev] | [next] | [standalone]

#33155 — Legacy properties on Window objects (was: A generic question)

Frank Kozuschnik wrote:

> Thomas 'PointedEars' Lahn:
>> JJ:
>>> If a HTML element has an ID, it can be referenced from the global
>>> object or the `window` object.
>> … in Quirks Mode only, as this is a legacy feature.
> 
> Which browser would nowadays support this "feature" in quirks mode only?

I do not know, but there have to be some.  It might also depend on the 
declared document type.  If you really want to know, you can build a test
case and find it out; for me, it would be a waste of time.

> Even Firefox started polluting the global object in standards mode some
> years ago.
> 
> https://www.w3.org/Bugs/Public/show_bug.cgi?id=11960#c27

Thank you.  That is both interesting and disturbing.
 
>> Do not use it.
> 
> I agree. So does the HTML spec, but nevertheless the spec seems to
> require it:
> 
> https://html.spec.whatwg.org/#named-access-on-the-window-object

That is _not_ “the HTML spec”, but the WHATWG “HTML Living Standard”.
There are people who consider this document normative even though it
lacks all characteristics of an industry standard.

The latest HTML specification is the HTML 5.1 W3C Recommendation, based on
a snapshot of the above:

<https://www.w3.org/TR/2016/REC-html51-20161101/>

This error-prone legacy feature is actually specified in

<https://www.w3.org/TR/2016/REC-html51-20161101/browsers.html#named-access-on-the-window-object>

such that

| […] The supported property names at any moment consist of the following, 
| in tree order, ignoring later duplicates:
| 
| * the child browsing context name property set.
| 
| * the value of the “name” content attribute for all “a”, “applet”, “area”,
|   “embed”, “form”, “frameset”, “img”, and “object” elements in the active
|   document that have a non-empty “name” content attribute, and
| 
| * the value of the “id” content attribute of any HTML element in the
|   active document with a non-empty “id” content attribute.

which I find even more disturbing.  It would seem that the wannabes have 
taken over core sections of the W3C at this point :-(

At least they have added this informal note at the top of the section:

| As a general rule, relying on this will lead to brittle code. Which IDs 
| end up mapping to this API can vary over time, as new features are added 
| to the Web platform, for example. Instead of this, use 
| “document.getElementById()” or “document.querySelector()”.

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#33157

On Sun, 30 Apr 2017 22:53:12 +0200, Frank Kozuschnik wrote:
> So does the HTML spec, but nevertheless the spec seems to 
> require it:
> 
> https://html.spec.whatwg.org/#named-access-on-the-window-object

Below code works for both Chrome and Firefox. Even in Standards mode.

  <!DOCTYPE html>
  <html>
  <head></head>
  <body id="abc">
  <script>
    alert(abc.innerHTML);
  </script>  
  </body>
  </html>

[toc] | [prev] | [next] | [standalone]

#33161

JJ:

> Below code works for both Chrome and Firefox. Even in Standards mode.

Yes, your code works, but it is widely discouraged for good reasons.

[toc] | [prev] | [next] | [standalone]

#33147

>I know there are at least three methods to identify or reference an object in DOM, namely, 
(a) by id or name etc.  for instance, getElementById() or getElementsByName or getElementsByTagName; 
(b) by relationship, for instance, parentNode 
(c) by class, for instance, document.getElementsByClassName 

>Just curious if there's additional method to achieve the same.   

You can retrieve dom elements by any CSS query, with document.querySelector and document.querySelectorAll. See https://www.w3schools.com/jsref/met_document_queryselector.asp

[toc] | [prev] | [next] | [standalone]

#33153

On Sunday, April 30, 2017 at 11:01:20 AM UTC-4, Ram Tobolski wrote:
> >I know there are at least three methods to identify or reference an object in DOM, namely, 
> (a) by id or name etc.  for instance, getElementById() or getElementsByName or getElementsByTagName; 
> (b) by relationship, for instance, parentNode 
> (c) by class, for instance, document.getElementsByClassName 
> 
> >Just curious if there's additional method to achieve the same.   
> 
> You can retrieve dom elements by any CSS query, with document.querySelector and document.querySelectorAll. See https://www.w3schools.com/jsref/met_document_queryselector.asp

Good to know.  Thanks.

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web