Conditionally Load JavaScript File

How to include an external javascript file conditionally?

This question has been asked before in Include a Javascript File in another Javascript File.
This peice of code may fit what you have been looking for

function include(filename)
{
   var head = document.getElementsByTagName('head')[0];

   var script = document.createElement('script');
   script.src = filename;
   script.type = 'text/javascript';

   head.appendChild(script)
}

if that script does not work, i suggest you to look over and read the post above: Include a Javascript File in another Javascript File.

I hope this helps, it may not be the answer you had been looking for, but it may just help.

Load and execute conditionally an external js file

In the long run you'd be better off using the proper asynchronous version of the adwords conversion script I think as it has been built specifically to handle these sorts of things. This way avoids any encoding mistakes and is easier to read and maintain.

So, based on this here is what I reckon you'd want (although I am no jQuery expert - I prefer to use standard javascript but hey each to their own):

<head>
  <!-- Add the async conversion script as usual - use async if you want --->
  <script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion_async.js" charset="utf-8"></script>
</head>

<!-- the rest of your site HTML and code -->

<script>
$(function() {
  if ([condition]) {
    window.google_trackConversion({
      google_conversion_id: "[...]",
      google_conversion_language: "en",
      google_conversion_format: "3",
      google_conversion_color: "ffffff",
      google_conversion_label: "[...]",
      google_conversion_value: 0,
      google_remarketing_only: false
    });
  }
});
</script>

Conditionally load and then reference external JS

One possible solution
I used

swiperJS.addEventListener('load', callback);

to get the call back

<head>
    <script>
        function loadScript(url, callback) {
            const viewWidth = window.innerWidth;
            if (viewWidth >= 480) {
                console.log('big screen');
                const swiperJS = document.createElement('script');
                swiperJS.type = "text/javascript";
                swiperJS.src = url;
                swiperJS.addEventListener('load', callback);
                document.head.appendChild(swiperJS);
            }
        }

        function init() {
            console.log("inside init")
            const swiper = new Swiper('.swiper');
        }
        loadScript("https://cdnjs.cloudflare.com/ajax/libs/Swiper/7.2.0/swiper-bundle.min.js", init)
    </script>

</head>

<body>
</body>

conditionally load javascript resource

What you're referring to is called short circuiting.

The code you see uses ||, which is the "or" operator. So for an "or" operator, only one of the operands needs to be true. That means that as soon as one of the operands fulfills the condition, the rest aren't evaluated. For example:

if (returnTrue() || returnFalse()) {

(where the functions speak for themselves) the returnFalse() method won't even be called because of short circuiting. The returnTrue() condition fulfills the "or" operator, because one of the operands (the first) evaluates to true.

An "and" operator is the opposite, where all of the operands must evaluate to true in order for it to be fulfilled.

For example:

if (returnTrue() && returnFalse()) {

The returnFalse() will be called because the if statement needs to know if all operands evaluate to true. Since the first one is true, it continues evaluating the operands. Another example:

if (returnTrue() && returnFalse() && returnTrue()) {

Only the first two calls will execute, but returnFalse() ruins the comparison, and it short circuits before it can get to the last returnTrue()

All of these "rules" apply to outside of an if statement, which is why your code works. So with your code, it's saying "if player is an object, continue evaluating operands." Your code is basically the same as:

if (typeof(player) == 'object') {
    document.write("stuff");
}

which I'm sure you know.

Reference:

https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Logical_Operators

How to conditionally load javascript files based on tab toggled?

I surrounded the js stripe code with click functions. works. when a radio or tab is clicked (depending on form navigation) the js code will "toggle" on. it works when going back and fourth between function toggles as well.

All solved now and haven't had issues from my tests