Reputation: 97
Hi guys I have this HTML generated by the Tapatalk plugin
<a href="https://uploads.tapatalk-cdn.com/20190521/77b84bf29111fc4dffc72261951.jpg" target="_blank" rel="noopener">
<img alt="77b84bf29111fc4dffc72261951.jpg" data-imageproxy-source="https://uploads.tapatalk-cdn.com/20190521/77b84bf29111fc4dffc72261951.jpg" src="/applications/core/interface/imageproxy/imageproxy.php?img=https://uploads.tapatalk-cdn.com/20190521/77b84bf29111fc4dffc72261951.jpg">
</a>
I need to go back to the href from this img tag to be able to add:
<a class="ipsAttachLink ipsAttachLink_image" data-fileext="jpg" data-fileid="" href="" rel="" data-ipslightbox="" data-ipslightbox-group="g58000">***</a>
those tags would allow me to open the image in a lightbox. is there a way to insert these tags to href looking in the src the word tapatalk?
Upvotes: 0
Views: 83
Reputation: 3726
You can fetch all the a
elements containing an img
and the img.src
containing 'tapatalk'. Loop through all and add attributes according to your needs.
//REM: This finds all images contained in an anchor (<a/>) with a [src] containing "tapatalk"
for(var tListOfElements=document.querySelectorAll('a > img[src*="tapatalk"]'), i=0, j=tListOfElements.length; i<j; i++){
var tAnchor = tListOfElements[i].parentNode; //REM: The anchor element
tAnchor.setAttribute('whatever', 'avalue') //REM: Setting attributes
}
<a href="https://uploads.tapatalk-cdn.com/20190521/77b84bf29111fc4dffc72261951.jpg" target="_blank" rel="noopener">
<img alt="77b84bf29111fc4dffc72261951.jpg" data-imageproxy-source="https://uploads.tapatalk-cdn.com/20190521/77b84bf29111fc4dffc72261951.jpg" src="/applications/core/interface/imageproxy/imageproxy.php?img=https://uploads.tapatalk-cdn.com/20190521/77b84bf29111fc4dffc72261951.jpg">
</a>
Upvotes: 1