How to call scripts only for a loaded template using fetch JS

[Snippet]

Can they be called inside the loaded template? Tried this but it doesn’t render properly the Vue carousel and no errors on the console either.

<div id="example">

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.7/vue.js"></script>
<script type="text/javascript" src="https://wlada.github.io/vue-carousel-3d/js/carousel-3d.umd.js"></script>

<!-- slider code -->
<carousel-3d :controls-visible="true" :clickable="true" :height="440">
</carousel-3d>

<!-- initialization -->
  <script>
new Vue({
            el: '#example',
             data: {
              slides: 3
            },
            components: {
              'carousel-3d': window['carousel-3d'].Carousel3d,
              'slide': window['carousel-3d'].Slide
            },
            methods: {
             testClick: function (){
                console.log("current slide click");
                document.getElementById("myLink").disabled = false;

             }
           }
          });
</script>

Another way could be something like this perhaps using appendchild?

fetch('<?php bloginfo('template_url'); ?>/portafolio-desktop-slider.php')
          .then(response => response.text())          
          .then( resultText => document.getElementById('example').innerHTML = resultText )
          var head = document.getElementsByTagName('head')[0];
          var script = document.createElement('script');
          var scriptsec = document.createElement('script');
          var scriptvue = document.createElement('script');
          script.type = 'text/javascript'
          scriptsec.type = 'text/javascript';
          scriptvue.type = 'module';
          script.src = "https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.7/vue.js";
          scriptsec.src = "https://wlada.github.io/vue-carousel-3d/js/carousel-3d.umd.js";
          scriptvue.src = "<?php bloginfo('template_url'); ?>/vue.js";
          head.appendChild(script);
          head.appendChild(scriptsec);
          head.appendChild(scriptvue);

[Snippet]

I managed to get it to work. In case it helps someone:

var head = document.getElementsByTagName('head')[0];
          var body = document.getElementsByTagName('body')[0];

          var VueScript = document.createElement("script");
          VueScript.src = "https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.7/vue.js";
          VueScript.async = false;
          head.appendChild(VueScript);

          var CarouselScript = document.createElement("script");
          CarouselScript.src = "https://wlada.github.io/vue-carousel-3d/js/carousel-3d.umd.js";
          CarouselScript.async = false;
          body.appendChild(CarouselScript);

          setTimeout(function(){
          var VueInitScript = document.createElement("script");
          VueInitScript.async = false;
          VueInitScript.src = "<?php bloginfo('template_url'); ?>/vue.js";
          body.appendChild(VueInitScript);

          }, 500);

[Snippet]

Here I used a delay function of half a second… but what is the proper way to handle it?

var head = document.getElementsByTagName('head')[0];
          var body = document.getElementsByTagName('body')[0];

          var VueScript = document.createElement("script");
          VueScript.src = "https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.7/vue.js";
          VueScript.async = false;
          head.appendChild(VueScript);

          var CarouselScript = document.createElement("script");
          CarouselScript.src = "https://wlada.github.io/vue-carousel-3d/js/carousel-3d.umd.js";
          CarouselScript.async = false;
          body.appendChild(CarouselScript);

          setTimeout(function(){
          var VueInitScript = document.createElement("script");
          VueInitScript.async = false;
          VueInitScript.src = "<?php bloginfo('template_url'); ?>/vue.js";
          body.appendChild(VueInitScript);

          }, 500);

[jwilkins.oboe]

I moved your topic over here because you are asking a follow up question for the same code.

Thanks!

[Snippet]

Oh alright, wasn’t aware of the criteria, now I am
Thanks to you.