javascript - form - onload input

¿Debería usar window.onload o script block?

Question

Tengo una función de JavaScript que manipula el DOM cuando se llama (agrega clases de CSS, etc.). Esto se invoca cuando el usuario cambia algunos valores en un formulario. Cuando el documento se carga por primera vez, quiero invocar esta función para preparar el estado inicial (que es más simple en este caso que configurar el DOM desde el servidor al estado inicial correcto).

¿Es mejor usar window.onload para hacer esta funcionalidad o tener un bloque de script después de los elementos de DOM que necesito modificar? En cualquier caso, ¿por qué es mejor?

Por ejemplo:

function updateDOM(id) {
    // updates the id element based on form state
}

debería invocarlo a través de:

window.onload = function() { updateDOM("myElement"); };

o:

<div id="myElement">...</div>
<script language="javascript">
    updateDOM("myElement");
</script>

El primero parece ser la forma estándar de hacerlo, pero este último parece ser igual de bueno, quizás mejor ya que actualizará el elemento tan pronto como se accione el guión, y siempre que se coloque después del elemento, yo no veo un problema con eso

¿Alguna idea? ¿Una versión es realmente mejor que la otra?

Answer 1

@El friki

Estoy bastante seguro de que Windows.onload se volverá a llamar cuando un usuario presione el botón Atrás en IE, pero no se vuelva a llamar en Firefox. (A menos que lo hayan cambiado recientemente).

En Firefox, se onload cuando el DOM ha terminado de cargarse independientemente de cómo haya navegado a una página.

Answer 2

Algunos frameworks de JavaScript, como mootools , le dan acceso a un evento especial llamado "domready":

Contiene la ventana Evento ''domready'', que se ejecutará cuando el DOM se haya cargado. Para asegurarse de que los elementos DOM existen cuando se ejecuta el código que intenta acceder a ellos, deben colocarse dentro del evento ''domready''.

window.addEvent(''domready'', function() {
  alert("The DOM is ready.");
});

Answer 3

Aquí hay un muy buen artículo sobre este tema:

http://mattberseth.com/blog/2008/08/when_is_it_safe_to_modify_the.html

Answer 4

Definitivamente use onload . Mantenga sus scripts separados de su página, o se volverá loco tratando de desenredarlos más tarde.

Answer 5

El evento de carga se considera la forma correcta de hacerlo, pero si no te importa usar una biblioteca de JavaScript, jQuery''s $ (document) .ready () es aún mejor.

$(document).ready(function(){
  // manipulate the DOM all you want here
});

Las ventajas son:

1. Llame a $ (document) .ready () tantas veces como desee para registrar código adicional para ejecutar; solo puede configurar window.onload una vez.
2. Las acciones $ (document) .ready () suceden tan pronto como se completa el DOM - window.onload tiene que esperar para las imágenes y tal.

Espero no convertirme en el tipo que sugiere jQuery en cada pregunta de JavaScript, pero realmente es genial.

Answer 6

He escrito mucho Javascript y window.onload es una manera terrible de hacerlo. Es frágil y espera hasta que se haya cargado cada activo de la página. Entonces, si una imagen tarda una eternidad o un recurso no excede el tiempo hasta 30 segundos, su código no se ejecutará antes de que el usuario pueda ver / manipular la página.

Además, si otra parte de Javascript decide usar window.onload = function () {}, su código será destruido.

La forma correcta de ejecutar el código cuando la página está lista es esperar a que el elemento que necesita cambiar esté listo / disponible. Muchas bibliotecas JS tienen esto como funcionalidad incorporada.

Revisa:

• http://docs.jquery.com/Events/ready#fn
• http://developer.yahoo.com/yui/event/#onavailable

Answer 7

Mi opinión es la anterior porque solo puedes tener 1 función window.onload, mientras que los bloques de script en línea tienes un n número.

Answer 8

Si bien estoy de acuerdo con los demás sobre el uso de window.onload si es posible para el código limpio, estoy bastante seguro de que window.onload se volverá a llamar cuando un usuario presione el botón Atrás en IE, pero no se vuelva a llamar en Firefox. (A menos que lo hayan cambiado recientemente).

Edición: podría tener eso al revés.

En algunos casos, es necesario utilizar una secuencia de comandos en línea cuando desee que se evalúe su secuencia de comandos cuando el usuario pulsa el botón Atrás desde otra página, de vuelta a su página.

Cualquier corrección o adición a esta respuesta es bienvenida ... No soy un experto en JavaScript.

Answer 9

onLoad porque es mucho más fácil decir qué código se ejecuta cuando se carga la página que tener que leer a través de los fragmentos de html que buscan las etiquetas de script que pueden ejecutarse.

Answer 10

window.onload en IE espera a que la información binaria se cargue también. No es una definición estricta de "cuando el DOM está cargado". Por lo tanto, puede haber un desfase significativo entre el momento en que se percibe que se carga la página y el momento en que se inicia el guión. Debido a esto, recomendaría buscar en uno de los abundantes frameworks JS (prototype / jQuery) para manejar el trabajo pesado por usted.