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


Groups > comp.lang.javascript > #30133

Re: onload and onclick

From Stefan Weiss <krewecherl@gmail.com>
Newsgroups comp.lang.javascript
Subject Re: onload and onclick
Date 2016-03-28 22:47 +0200
Organization albasani.net
Message-ID <ndc59k$s7s$2@news.albasani.net> (permalink)
References <ndb6qc$evs$1@gioia.aioe.org>

Show all headers | View raw


emf wrote:
> window.onload = function () {
>     "use strict";
>     document.getElementById("start").onclick = function () {
>         requestFullScreen();
>         init();
>     };
> };
> 
> I arrived at this solution after deciding to remove any JS code from the
> HTML code. It works fine, however it looks a little too complicated for
> my personal taste. Is there a simpler way to write it?

This is pretty typical code for what you're doing. There are a few
variations that could make it a little more concise, but nothing
dramatic. For example:

- If you include this script after the element with the ID "start", you
  don't have to wait for the "load" event before you assign a click
  handler to the element.
- Strict mode makes no difference in this particular function, so the
  "use strict" statement could be left out.
- Explicitly referring to the `window` object is optional; you could
  write `onload = function ()...` with the same effect.

Personally, I wouldn't use any of these. I would even go a step in the
opposite direction and use the more verbose `addEventListener()` method
instead of the DOM-0 style "onload" and "onclick" properties:

  window.addEventListener("load", function () {
      // etc
  });

This allows for more than one listener per target and event type, which
is particularly useful for the "load" event.

Most people use libraries to simplify common tasks like event handling
and element selection. With one such library, your code might look like
this:

  $(function () {
      $("#start").click(function () {
          requestFullScreen();
          init();
      });
  });

That's shorter (and also uses the "DOMready" event). Loading a huge
library for just a few lines of code would be counterproductive, but
typically the library gets used for the rest of the code, as well.


- stefan

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


Thread

onload and onclick emf <emfril@gmail.com> - 2016-03-28 08:07 -0400
  Re: onload and onclick Stefan Weiss <krewecherl@gmail.com> - 2016-03-28 22:47 +0200
    Re: onload and onclick Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-03-28 23:23 +0200
      Re: onload and onclick Frank Kozuschnik <franko@nurfuerspam.de> - 2016-03-29 00:20 +0200
        Re: onload and onclick Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-03-29 00:43 +0200
      Re: onload and onclick Stefan Weiss <krewecherl@gmail.com> - 2016-03-29 00:57 +0200
        Re: onload and onclick Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-03-29 02:04 +0200
          Re: onload and onclick Stefan Weiss <krewecherl@gmail.com> - 2016-03-29 04:47 +0200
            Re: onload and onclick Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-03-31 20:06 +0200
              Re: onload and onclick Aleksandro <aleksandro@gmx.com> - 2016-03-31 15:37 -0300
              Re: onload and onclick Stefan Weiss <krewecherl@gmail.com> - 2016-04-02 01:43 +0200
    Re: onload and onclick Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-03-29 00:33 +0200
    Re: onload and onclick Stefan Weiss <krewecherl@gmail.com> - 2016-03-29 05:03 +0200
    Re: onload and onclick emf <emfril@gmail.com> - 2016-03-29 01:45 -0400
  Re: onload and onclick Aleksandro <aleksandro@gmx.com> - 2016-03-28 18:33 -0300

csiph-web