JavaScript window.onload和body.onload之间的区别

在「windows onloads」和「body onloads」之间存在一些细微的差别，但在接近它们的差异之前，我们首先需要了解这些onload是什么。之后，我们将了解它们在不同场景中的使用情况，进而注意到它们之间的细微差异。

onloads: 当一个对象完全加载时，onloads事件就会触发，onload事件分为两种类型：windows onload和body onload。

Windows onload: 这个窗口的onload事件在开始时触发。
Body onload: 这个body的onload事件会在所有内容下载完毕后触发，如果我们想要找到一个元素并更新其样式或内容，那么body onload是正确的选择。

注意: 如果更新样式和内容对您来说不重要，那么使用哪个onload就无关紧要。

下面的示例阐明了windows onload和body onload之间的差别：

<!DOCTYPE html> 
<html> 
   <head> 
   </head> 
   <body onload="bodyLoad()"> 
      <div id="B1"> 
         <h1 style="color: green;">GeeksforGeeks</h1> 
           
<p>A Computer Science Portal for Geeks</p> 
  
      </div> 
      <script> 
          
        // Body onload 
         function bodyLoad() { 
             alert("Alert from body_onload"); 
             alert("content from d1: " 
                   + document.getElementById("d1").innerText); 
         } 
           
         // Window onload  
         function winLoad() { 
             alert("Alert from window_onload"); 
             if (document.getElementById("B1") != null) { 
                 alert("Content from body: " 
                       + document.getElementById("B1").innerText); 
             } 
             else { 
                 alert("Failed to find B1"); 
             } 
         } 
         window.onload = winLoad(); 
      </script> 
   </body> 
</html>

输出：