how to use on DOM load

Rookie Contributor

I would like to use to send Tealium events for internal promotions once the DOM has loaded on a given page like:

jQuery(document).ready(function() {{data goes here});

(I made sure that this loads towards the end of the page)

At the time of execution, utag isn't available yet and hence its throws a "utag is not defined" error.

Is there a way to execute such code when "utag" is available? perhaps a callback function from utag.js?

Please advise.


how to use on DOM load

Tealium Employee

You can use:

jQuery(window).load(function(){{data goes here});

how to use on DOM load

Rookie Contributor

I have read that window.load may not be consistent across browsers, especially considering mobile browsers.
I am using the following approach currently:

// when utag.js is available within page source, trigger calls
jQuery('script[src*="utag.js"]').on('load', function() {
// calls here...

how to use on DOM load

Employee Emeritus

If you have the ability to edit source code on your page, something like this could work:

Basically editing the way you load utag.js and firing a callback. The method you suggested would run into issues if somehow it executed after utag.js finished loaded before that statement is even reached (a real possibility with file caching). The 'load' would never trigger because it's already loaded.