Heim > Artikel > Web-Frontend > Was ist der Unterschied zwischen Onload und Load in JavaScript?

Was ist der Unterschied zwischen Onload und Load in JavaScript?

青灯夜游Original: 2020-12-14 10:06:243779Durchsuche

Unterschied: Load gibt nur die Ereignismethode an, wird aber nicht ausgeführt; Onload gibt an, dass sie ausgeführt wird, nachdem alles auf der Seite geladen wurde, da nur eine Onload-Funktion auf der Seite angezeigt werden darf. Onload kann ausgeführt werden, bevor einige Elemente geladen sind, und Load wird ausgeführt, nachdem alle Elemente geladen sind.

Verwandte Empfehlungen: „jQuery Video Tutorial“

Sollte die Ladefunktion beim Schreiben von Interaktionen Onload oder Load sein?

Nutzen Sie die Gelegenheit, es zu organisieren, damit Sie es nicht vergessen! !

window.onload(function) in js entspricht $(window).onload(function) in jquery

1: window.load gibt nur die Ereignismethode an, wird jedoch nicht ausgeführt, indem Sie mit der Maus darüber fahren und darauf klicken Ereignisse, die ausgeführt werden müssen, werden erst nach Verwendung von Hover und Onclick ausgeführt. Wenn die Seite geladen und gerendert wird, tritt normalerweise ein Ladeeffekt auf. Sie können ihn zu diesem Zeitpunkt verwenden:

              $(window).load(function(){
                $(".loadingicon").addClass("loader-chanage");
                $(".loadingicon").fadeOut(300,function(){
                  $(".loadingicon").remove();
                  $(".maker").show().animate({"right":"0"},500);
                });
              })

$(window .load(function) in the page Es wird erst ausgeführt, wenn die Bilder und andere Ressourcen geladen sind.

2: window.onload bedeutet, dass es ausgeführt wird, nachdem alles auf der Seite geladen wurde darf auf der Seite erscheinen, da es nur eine programmierbare Funktion hat:

JS:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>demo float</title>
        
    </head>
    <body>
        <script type="text/javascript">
            window.onload = function(){   alert("这是1");};
            window.onload = function(){   alert("这是2");};
        </script>
    </body>
</html>

Laufergebnisse:

Drei: Nachdem wir über das oben Gesagte gesprochen haben, gibt es auch eine Jquery $(document).ready( Funktion), die ausgeführt wird, nachdem alle DOM-Strukturen auf der Webseite gezeichnet wurden, möglicherweise DOM-Elemente Der zugehörige Inhalt wurde nicht geladen, z. B. Bilder und zugehörige Höhen- und Breiteneinstellungen usw. Zu diesem Zeitpunkt können Sie die Last berücksichtigen Methode in jquery, um dies zu vermeiden; außerdem kann $(document).ready(function) unbegrenzt viele Funktionen schreiben, wie zum Beispiel:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>demo float</title>
        <script type="text/javascript" src="http://static.ruilife.net/static/js/jquery-1.9.1.min.js"></script>
    </head>
    <body>
        <script type="text/javascript">
            $(document).ready(function(){     console.log("这是1");});
            $(document).ready(function(){     console.log("这是2");});
        </script>
    </body>
</html>

Run Result:

4. document

document.write(_LoadingHtml);
      
      //监听加载状态改变
      document.onreadystatechange = completeLoading;
       
      //加载状态为complete时移除loading效果
      function completeLoading() {
          if (document.readyState == "complete") {
              var loadingMask = document.getElementById('loadingp');
              loadingMask.parentNode.removeChild(loadingMask);
          }
      }

Zum Schluss noch einmal:

js: Diese Funktion wird ausgeführt, sobald die Seite window.onload ausgeführt wird. Wenn diese Funktion ausgeführt wird, sind die Bilder auf der Seite möglicherweise noch nicht geladen!

jquery: Führen Sie diese Funktion aus, nachdem die Bilder oder andere Dinge auf der Seite $(window).load() geladen wurden.

Das vollständige Format zum Aufrufen der Lademethode lautet: laden (URL, [Daten], [Rückruf]) Die Parameter sind URL-Adresse, Dateityp (PHP, HTML usw.) und Rückruffunktion und unterstützen auch das Laden von Selektoren Load("test.html #contentidname")

Weitere Kenntnisse zum Thema Programmierung finden Sie unter:

Programmierlehre

! !

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen Onload und Load in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Was ist ein Slider in JQuery?Nächster Artikel：Was ist ein Slider in JQuery?

In Verbindung stehende Artikel

Mehr sehen