Llamada a la función de carga de la ventana de JavaScript

  2. HowTo
  3. JavaScript Howtos
  4. Llamada a la función de carga de la …
Muhammad Muzammil Hussain 30 enero 2023
JavaScript JavaScript Window Onload Method
  1. Uso de la funcionalidad window.onload con ejemplo en HTML
  2. Examine el código HTML dado en unos pocos pasos
  3. Manera alternativa de ver los mismos resultados
Llamada a la función de carga de la ventana de JavaScript

Este artículo explica el propósito del método window.onload en JavaScript con un ejemplo. La función window.onload se ejecuta para realizar una tarea una vez que la página del navegador termina de cargarse.

Uso de la funcionalidad window.onload con ejemplo en HTML

El método window.onload se activa cuando la página está completamente cargada en el navegador (así como todas las imágenes, estilo, scripts y CDN). Aquí puede ver un ejemplo de código fuente de una página HTML que utiliza el método window.onload para la ejecución automática para mostrar un cuadro de alerta.

<html>
<head>
<title>(Window.onload function in HTML)</title>
<script type="text/javascript">

function code(){
alert(" Alert inside code function Window.onload");
}

window.onload=code();
</script>

</head>
<body>

<h1> Graphic Designer Firm </h1>
    <p1> A craft of creating visual content to communicate messages.</p1>
</br> <img src = "Graphic-Design.png" height="500px" width="500px" >

</br> <hr width="800">
</body>
</html>

En la fuente de la página HTML anterior, puede ver la etiqueta <script type="text/javascript"> que usa JavaScript en doctype html. En el siguiente paso, el function code() se declara dentro de la etiqueta <script>.

El function code() se llama window.onload. Muestra un diálogo de alerta predeterminado cuando una página web se carga completamente con imágenes y contenido de texto.

Examine el código HTML dado en unos pocos pasos

Siga estos cuatro sencillos pasos y obtenga una comprensión clara del método window.onload.

  • Crea un documento de texto. Puede utilizar el bloc de notas o cualquier otra herramienta de edición de texto.
  • Pega el código dado en el archivo de texto creado.
  • Guarda ese archivo de texto con la extensión .html y ábrelo con cualquier navegador predeterminado.
  • Puede ver un cuadro de alerta que aparece justo después de la carga completa de la página.

Manera alternativa de ver los mismos resultados

Puede obtener los resultados del mensaje de alerta utilizando un evento alternativo onload a través de una etiqueta de cuerpo. A continuación, se muestra un ejemplo de una etiqueta de cuerpo que utiliza la ejecución automática para llamar a un código de función que contiene un cuadro de alerta:

<script type="text/javascript">

function code(){
alert(" Alert inside code function");
}
</script>

<body onLoad="code()";>

En ambos ejemplos, onLoad de la etiqueta del cuerpo y window.onload tienen la misma funcionalidad para ejecutar las declaraciones después de completar la carga de la página.