Tengo la siguiente función javascript:
function actionFunction() { let lookup_table = { 'imageurl1': "imageurl2", }; for (let image of document.getElementsByTagName("img")) { for (let query in lookup_table) { if (image.src == query) { image.src = lookup_table[query]; } } } }Quiero que funcione incluso después de que una página esté completamente cargada (en otras palabras, trabajar con elementos html generados dinámicamente que aparecieron después de la carga por js de la página).
Podría ser ejecutando la función cada x segundos o cuando se detecta cierto elemento xpath dentro de la página, o cada vez que se carga una determinada URL de imagen dentro del navegador (que es mi objetivo principal aquí).
¿Qué puedo hacer para lograr esto usando javascript + greasemonkey? Gracias.
¿Ha intentado ejecutar su código en la terminal del navegador para ver si funciona sin la participación de Greasemonkey?
En cuanto a su pregunta, puede usar setInterval para ejecutar el código dado cada x cantidad de tiempo o puede usar MutationObserver para monitorear los cambios en el dominio de la página web. En mi opinión, setInterval es lo suficientemente bueno para el trabajo, puede intentar aprender cómo funciona MutationObserver en el futuro.
Así que reescribiendo tu código:
// arrow function - doesn't lose this value and execution context // setInterval executes in a different context than the enclosing scope which makes functions lose this reference // which results in being unable to access the document object // and also window as they all descend from global scope which is lost // you also wouldn't be able to use console object // fortunately we have arrow functions // because arrow functions establish this based on the scope the arrow function is defined within // which in most cases is global scope // so we have access to all objects and their methods const doImageLookup = () => { const lookup_table = { 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png': 'https://www.google.com/logos/doodles/2022/gama-pehlwans-144th-birthday-6753651837109412-2x.png', }; const imgElementsCollection = document.getElementsByTagName('img'); [...imgElementsCollection].forEach((imgElement) => { Object.entries(lookup_table).forEach(([key, value]) => { const query = key; // key and value describe object's properties const replacement = value; // here object is used in an unusual way, i would advise to use array of {query, replacement} objects instead if (imgElement.src === query) { imgElement.src = replacement; } }); }); }; const FIVE_MINUTES = 300000; // ms setInterval(doImageLookup, FIVE_MINUTES);Puede hacer una versión más compleja rastreando el conteo de img y solo haciendo imageLookop si su número aumenta. Esta sería una gran optimización y le permitiría ejecutar la consulta con más frecuencia (aunque 5 minutos es un intervalo bastante largo, ajústelo según sea necesario).