如何在 javascript 代码中包含脚本？

Question

I want to implement the following code to improve my site performance and try to fire the script after scroll and wait 1 second.

<script type="text/javascript">
  window.addEventListener('scroll',() =>
        setTimeout(() => {

       //Delay calendly
            <script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>

        }, 1000);                                           
  );

</script>

I have this calendly script that I want to delay. The thing is I can't include the script inside another script, so, are there any way to make it?

Thanks!

Answer 1

You can do this with only the vanilla dom:

// ... something happens
var scr_elem = document.createElement('script');
scr_elem.type = 'text/javascript'
scr_elem.src = 'https://assets.calendly.com/assets/external/widget.js'
document.body.appendChild(scr_elem);

Answer 2

You can create a script dynamically and append to the head/body .

let timer;
window.addEventListener("scroll", () => {
  if (!timer) {
    timer = setTimeout(() => {
      const script = document.createElement("script");
      script.type = "text/javascript";
      script.src = "https://assets.calendly.com/assets/external/widget.js";
      document.body.appendChild(script);
    }, 1000);
  }
});