@@Henry > ~~~js > function scrollcntrl() > { > document.getElementsByTagName('h2')[0].innerHTML = document.documentElement.scrollTop; > } > > window.onscroll = function(){scrollcntrl()}; > > // warum reicht hier eigentlich nicht: window.onscroll = scrollcntrl(); > ~~~ Weil das, was du `window.onscroll`{:.language-js} zuweist, eine *Funktionsreferenz* sein muss. [[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onscroll)] `function () { scrollcntrl(); }`{:.language-js} ist eine anonyme Funktion, die wiederum `scrollcntrl`{:.language-js} aufruft. `scrollcntrl()`{:.language-js} ist keine Funktions*referenz*, sondern ein Funktions*aufruf*; er liefert den Rückgabewert der Funktion `scrollcntrl`{:.language-js}. (Da in dieser Funktion kein `return …`{:.language-js} vorkommt, dürfte der Rückgabewert `null`{:.language-js} sein.) Funktionsreferenz zuweisen ginge so: `window.onscroll = scrollcntrl;`{:.language-js} --- Dass man `.on…`{:.language-js} grundsätzlich nicht verwenden sollte, hat beatovich ja schon gesagt. Was in MDN steht (*“`Element.onscroll` is equivalent to `element.addEventListener("scroll" ... )`”*{:@en}) stimmt nämlich nicht: ~~~JavaScript window.onscroll = foo; window.onscroll = bar; ~~~ Die zweite Angabe überschreibt die erste. Beim Feuern des Events wird nur `bar()`{:.language-js} ausgeführt. ~~~JavaScript window.addEventListener('scroll', foo); window.addEventListener('scroll', bar); ~~~ Es werden *zwei* EventListener definiert. Beim Feuern des Events werden `foo()`{:.language-js} *und* `bar()`{:.language-js} ausgeführt. --- Generell sollte man die Überwachung des `scroll`-Events besser vermeiden. *Stromfresser,* *performance killer.*{:@en} LLAP 🖖 -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann

@@Henry > ~~~js > function scrollcntrl() > { > document.getElementsByTagName('h2')[0].innerHTML = document.documentElement.scrollTop; > } > > window.onscroll = function(){scrollcntrl()}; > > // warum reicht hier eigentlich nicht: window.onscroll = scrollcntrl(); > ~~~ Weil das, was du `window.onscroll`{:.language-js} zuweist, eine *Funktionsreferenz* sein muss. [[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onscroll)] `function () { scrollcntrl(); }`{:.language-js} ist eine anonyme Funktion, die wiederum `scrollcntrl`{:.language-js} aufruft. `scrollcntrl()`{:.language-js} ist keine Funktions*referenz*, sondern ein Funktions*aufruf*; er liefert den Rückgabewert der Funktion `scrollcntrl`{:.language-js}. (Da in dieser Funktion kein `return …`{:.language-js} vorkommt, dürfte der Rückgabewert `null`{:.language-js} sein.) Funktionsreferenz zuweisen ginge so: `window.onscroll = scrollcntrl;`{:.language-js} --- Dass man `.on…`{:.language-js} grundsätzlich nicht verwenden sollte, hat beatovich ja schon gesagt. Was in MDN steht (*“`Element.onscroll` is equivalent to `element.addEventListener("scroll" ... )`”*{:@en}) stimmt nämlich nicht: ~~~JavaScript window.onscroll = foo; window.onscroll = bar; ~~~ Die zweite Angabe überschreibt die erste. Beim Feuern des Events wird nur `bar()`{:.language-js} ausgeführt. ~~~JavaScript window.addEventListener('scroll', foo); window.addEventListener('scroll', bar); ~~~ Es werden *zwei* EventListener definiert. Beim Feuern des Events werden `foo()`{:.language-js} *und* `bar()`{:.language-js} ausgeführt. --- Generell sollte man die Überwachung des `scroll`-Events besser vermeiden. *Performance killer.*{:@en} LLAP 🖖 -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann