Cuando aparece div en la pantalla, necesito ejecutar una función
pero como soy nuevo en javascript, no pude tener éxito.
¿Cómo puedo hacerlo usando el observador de intersección?
<div id='demo'/>mi funcion
function myFunc() { var headID = document.getElementById("demo"); var newScript = document.createElement('script'); newScript.src = '/myscript.js'; headID.appendChild(newScript); }En la devolución de llamada del observador, compruebe cada entrada observada si se cruzan. Si es así, llame a myFunc() y desobserve el elemento para llamar a myFunc solo una vez.
function myFunc() { const script = document.createElement('script'); script.src = '/myscript.js'; demo.append(script); console.log('Script appended'); } /** * This is called whenever an observed element is * in view or went out of view. */ const onIntersection = (entries, observer) => { for (const { isIntersecting, target } of entries) { if (isIntersecting) { myFunc(); observer.unobserve(target); } } }; /** * The options for the observer. * 50px 0px on the rootMargin says that the observer triggers * after 50px in the top and bottom. */ const options = { root: null, rootMargin: '50px 0px', threshold: [0] }; /** * Select the demo element, create an observer and start observing the demo element. */ const demo = document.getElementById('demo'); const observer = new IntersectionObserver(onIntersection, options); observer.observe(demo); #demo { display: block; height: 100px; width: 100px; background: red; margin-top: 1000px; } <div id="demo"></div>