URLs attributes BEFORE DOM ready event

I am working on this test page: https://www.incaet.it/progetti-edit-2/

As you can see there are 2 buttons “_blank” and “_BLANK”, later I’ll explain their purpose.

Since I’m editing this page with elementor (wordpress) I am able only to assign to the media gallery (the projects you see) an image and an URL without declaring any HTML. The goal would be to open a lightbox with the URL inside the media gallery elements. To reach this goal I bought a wordpress plugin that claims to open inside a lightbox EVERY link on the website if they have a “_blank” attribute.

The problem is that I tried to assign this attribute directly with the media gallery toolbox, since I’m not coding directly the HTML, checking the “open page in new tab” , this option is giving an attribute “_BLANK” that is not working, maybe it sounds stupid but it’s accepted only if it is not capsed (that’s why I tried to place 2 basic html buttons).

To try forcing the lightbox opening I tried this code (it’s not the actual solution since it gives _blank to every link)

window.onload = function(){
        var a = document.getElementsByTagName('a');
        for (var i=0; i<a.length; i++){
            a[i].setAttribute('target', '_blank');
        }
    }

That didn’t work and I have been told it’s because “lightbox is attached to elements on DOM ready event. It happens before “load” event.”

Do you may know anything I could do to place this “_blank” attribute to every element of the media gallery before the DOM ready event? I have been trying achieving this results since a long time but still no luck.

Answer

I’m not sure what links you want to be target="_blank" but you can delegate an event listener for them if you find a class name that you can use when they do exist.

A delegated listener on document does not need these links to exist when you run this code.

Note that DOM ready actually occurs before load

Something like:

jQuery(document).on('click', '.someLightboxClassName a', function(){
   this.target = '_blank';
})

Advertisement

Answer