Tengo un script que quiero usar, sin embargo, no sé si necesito preparar el documento.
$(window).scroll(function(){ $(".hero-h1").css("opacity", 1 - $(window).scrollTop() / 250); });Si posiciona y ejecuta su secuencia de comandos de modo que los elementos de los que depende ya existan en el momento en que se ejecuta, no.
Esta es esencialmente la misma pregunta que si alguien necesita usar
window.addEventListener('DOMContentLoaded', () => { // all of the code }); Si, en el momento en que se ejecuta su secuencia de comandos, intenta seleccionar un elemento que no siempre está presente, como un <div> particular en la página, por ejemplo
$('.mybutton').on('click', () => { // ... Luego, en el momento en que se ejecuta la línea anterior, debe asegurarse de que .mybutton existe en la página.
Esto se puede lograr de varias maneras. Una de estas formas es envolviendo todo el script en .ready (o, como se suele preferir hoy en día, solo una función simple):
$(() => { $('.mybutton').on('click', () => { // ...Otra forma en que se puede lograr es colocando su secuencia de comandos después de todos los elementos de los que depende en el marcado HTML, por ejemplo
// lots of HTML code <button class="mybutton">click</button> <script src="myscript.js"><script> </body>Si coloca su secuencia de comandos al final del cuerpo, todos los elementos del marcado de la página estática existirán en el DOM para entonces.
Una tercera forma es darle a su secuencia de comandos el atributo defer .
<script defer src="myscript.js"><script>Esto asegurará que todos los elementos estáticos se carguen antes de que se ejecute el script.
Para este caso particular suyo, si todo lo que hace es agregar un controlador de desplazamiento a la ventana, entonces no hay elementos que esperar para adjuntar el controlador, por lo que es posible que no necesite usar ninguno de los enfoques anteriores.