Llamar a la función de JavaScript en la carga de la página

Anika Tabassum Era 12 octubre 2023
  1. Función de JavaScript que toma variables como parámetro
  2. Función de llamada de JavaScript que toma funciones como argumento en la carga
Llamar a la función de JavaScript en la carga de la página

Una función que se puede llamar cada vez que se carga la página web. Esta convención depende del objeto del navegador window y su propiedad onload. La forma básica de saber que se está llamando a su función es verificar el panel de la consola.

Para el ejemplo demostrativo, consideraremos una estructura HTML, donde queremos visualizar cómo será nuestra salida. Y cada vez que recarguemos la página web, el panel de la consola responderá a una instrucción determinada dirigida por la propiedad window.onload.

Función de JavaScript que toma variables como parámetro

Aquí, usaremos una función que toma variables como argumentos. Además, la unidad de codificación experimentada en jsbin es para obtener una mejor comprensión. Puede, de cualquier manera, usar su navegador y el editor que prefiera.

Fragmento de código:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Test</title>
 
</head>
<body onload = func()>
  <p id="output"></p>
<script>  
var x = 40;
var y = 2;
  
function func(x, y){
  return x+y;
}

window.onload = function(){
 console.log(func(x,y)); 
}

document.getElementById('output').innerHTML = func(x,y);
</script>
</body>
  
</html>

Producción:

función onload js con función de parámetro variable

En este caso, la parte del script se agregó dentro del cuerpo HTML y, como puede ver, en cada carga de la página web, la consola tiene un valor, lo que explica que el código general está funcionando.

Además, el caso de uso básico para window.onload es garantizar que la página se cargue correctamente cada vez. Lo más probable es que funcione como un parámetro para garantizar un bloque de código sin errores en su HTML. Por lo tanto, puede usarlo en cualquier lugar según su conveniencia.

Función de llamada de JavaScript que toma funciones como argumento en la carga

Los siguientes ejemplos explicarán la función de la propiedad window.onload de manera diferente. Usaremos una sección de código HTML y una sección de código JavaScript individual. Los parámetros de nuestra función son algunas otras funciones.

Fragmento de código:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Test</title>
  <style>
    p{
      background: white;
    }
  </style>
</head>
<body onload = func()>
  <p id="output"></p>
</body>
  
</html>
function f1() {
  return '4';
}

function f2() {
  return '2';
}

function func(f1, f2) {
  return f1() + f2();
}

window.onload =
    function() {
  console.log(func(f1, f2));
}

    document.getElementById('output')
        .innerHTML = func(f1, f2);

Producción:

función onload js con función parámetro función

Desde el escenario de salida, cada vez que se presiona Ejecutar con JS, brinda una experiencia similar a la de cargar una página web. El código no tiene ningún error, y esa es la declaración inferible que podemos derivar al llamar a una función en cada carga de página.

Anika Tabassum Era avatar Anika Tabassum Era avatar

Era is an observer who loves cracking the ambiguos barriers. An AI enthusiast to help others with the drive and develop a stronger community.

LinkedIn Facebook

Artículo relacionado - JavaScript Function