Home/ Questions/Q 9013501
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-16T03:17:05+00:00

I’m coding a script that will be used on several websites as a plugin.

  • 0

I’m coding a script that will be used on several websites as a plugin. I have to use only Javascript, no framework. I’m asking myself, what is the best way to load my script without causing any trouble with other scripts or frameworks that can be loaded on these websites.
I thought to do a global function where i call the functions I want to use, and I put this function on the window.load event, like this :

<script>
    var global = function(){
    object.domain.function1();
    object.domain.function2(param1, param2);
    object.domain.function3(1);
}
(function(){
    if(document.addEventListener){
        document.addEventListener('load',global, false);
    }
    if(document.attachEvent){
        document.attachEvent('onload',global);
    }
})();
</script>

Or simply :

<script>
    object.domain.function1();
    object.domain.function2(param1, param2);
    object.domain.function3(1);
</script>

Of course, I need some elements are loaded on my page.
Thanks in advance.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    what is the best way to load my script without causing any trouble with other scripts or frameworks

    The things you need to consider are, are you..

    • polluting the namespace
    • obstructing another script

    The second point is easy to work around, .addEventListener supports adding many listeners for the same event which won’t overwrite each other. There are two different events you might be interested in, 'load' on window and 'DOMContentLoaded' on document. You can always put a <script> at the very end of <body> but I personally don’t like doing this because you’re mixing HTML with JavaScript or changing the DOM tree.

    For the first point, this can be done via the use of anonymous functions and, should you need to occupy the namespace, keeping all of your variables and methods inside one object to minimise your impact.

    Putting all this together you may end up with something like this

    var myObjectName = { // everything in one object in global namespace
    domain: {
        function1: function () { /*...*/ },
        function2: function () { /*...*/ },
        function3: function () { /*...*/ }
    }
};

(function (fn) {
    if (window.addEventListener) {
        window.addEventListener('load', fn, false);
    }
    else if (window.attachEvent) { // Consider if support for `.attachEvent` is really necessary, people need to move on.
        window.attachEvent('onload', fn);
    }
})(function () { // pass your function anonymously
    myObjectName.domain.function1();
    myObjectName.domain.function2(param1, param2);
    myObjectName.domain.function3(1);
});
    • 0