Estoy tratando de reemplazar parte del texto en una página web usando un script de tampermonkey pero tengo problemas para identificar el elemento adecuado. He conseguido que esto funcione en el pasado, pero es bastante impredecible.
Para la fuente a continuación, estaba pensando que debería usar document.getElementsByClassName("product-return-message__label product-return-message__label--pdp product-return-message__label--pdp-large").innerHTML = "bla, bla, bla" basado en el nombre de clase más cercano pero no funciona.
En general, tengo dificultades para identificar qué nombre/identificación pertenece al texto que quiero reemplazar cuando miro la fuente de una página web. Si pudiera identificar los getElement(s) y el nombre/identificación que debería usar según la fuente a continuación, ¡se lo agradecería! ¡Gracias!
fuente parcial: ... <div class="product-return-message product-return-message--pdp product-return-message--pdp-large" data-test="message"><svg aria-hidden="true" role="img" viewBox="0 0 100 100" class="product-return-message__icon"></svg><div class="product-return-message__content product-return-message__content--pdp product-return-message__content--pdp-large" data-test="message-content"><div aria-level="2" class="product-return-message__label product-return-message__label--pdp product-return-message__label--pdp-large" data-test="message-label" role="heading">TEXT I WANT TO REPLACE</div> ...
¿Qué hay de usar document.querySelector con el atributo CSS selector ?
const element = document.querySelector("div[data-test='message-label']"); if(element) { element.innerHTML = "found!"; } <div class="product-return-message product-return-message--pdp product-return-message--pdp-large" data-test="message"> <div class="product-return-message__content product-return-message__content--pdp product-return-message__content--pdp-large" data-test="message-content"><div aria-level="2" class="product-return-message__label product-return-message__label--pdp product-return-message__label--pdp-large" data-test="message-label" role="heading">TEXT I WANT TO REPLACE</div> <svg aria-hidden="true" role="img" viewBox="0 0 100 100" class="product-return-message__icon"></svg>QuerySelector sería de ayuda. Al igual que @Tareq, puede buscar por div[data-test='message-label'] o en su caso: document.querySelector('div > div > div').innerHTML = Hello World . La forma más agradable de estas dos variantes es la de tareq.