javascript - que - style html
¿Cómo ejecutar una función cuando la página está cargada? (5)
Eche un vistazo a la secuencia de comandos domReady que permite la configuración de múltiples funciones para ejecutar cuando el DOM se haya cargado. Básicamente, es lo que Dom Ready hace en muchas bibliotecas populares de JavaScript, pero es liviano y puede tomarse y agregarse al comienzo de su archivo de script externo.
Ejemplo de uso
// add reference to domReady script or place
// contents of script before here
function codeAddress() {
}
domReady(codeAddress);
Quiero ejecutar una función cuando la página está cargada, pero no quiero usarla en la etiqueta <body> .
Tengo un script que se ejecuta si lo inicializo en el <body> , así:
function codeAddress() {
// code
}
<body onLoad="codeAddress()">
Pero quiero ejecutarlo sin <body onLoad="codeAddress()"> y he intentado muchas cosas, por ejemplo esto:
window.onload = codeAddress;
Pero no está funcionando.
Entonces, ¿cómo lo ejecuto cuando la página está cargada?
En lugar de utilizar jQuery o window.onload, JavaScript nativo ha adoptado algunas funciones excelentes desde el lanzamiento de jQuery. Todos los navegadores modernos ahora tienen su propia función lista DOM sin el uso de una biblioteca jQuery.
Lo recomendaría si usa Javascript nativo.
document.addEventListener(''DOMContentLoaded'', function() {
alert("Ready!");
}, false);
Tomando la respuesta de Darin pero estilo jQuery. (Sé que el usuario pidió javascript).
$(document).ready ( function(){
alert(''ok'');
});
window.onload = codeAddress; debería funcionar - aquí hay una demostración y el código completo:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function codeAddress() {
alert(''ok'');
}
window.onload = codeAddress;
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function codeAddress() {
alert(''ok'');
}
</script>
</head>
<body onload="codeAddress();">
</body>
</html>
window.onload = function() { ... etc. no es una gran respuesta.
Es probable que esto funcione, pero también romperá cualquier otra función que ya esté conectada a ese evento. O bien, si otra función se engancha a ese evento después del tuyo, romperá el tuyo. Entonces, puedes pasar muchas horas más tarde tratando de descubrir por qué algo que ya funcionaba ya no funciona.
Una respuesta más robusta here:
if(window.attachEvent) {
window.attachEvent(''onload'', yourFunctionName);
} else {
if(window.onload) {
var curronload = window.onload;
var newonload = function(evt) {
curronload(evt);
yourFunctionName(evt);
};
window.onload = newonload;
} else {
window.onload = yourFunctionName;
}
}
Algún código que he estado usando, no recuerdo dónde lo encontré para darle crédito al autor.
function my_function() {
// whatever code I want to run after page load
}
if (window.attachEvent) {window.attachEvent(''onload'', my_function);}
else if (window.addEventListener) {window.addEventListener(''load'', my_function, false);}
else {document.addEventListener(''load'', my_function, false);}
Espero que esto ayude :)