Delay loading of script

Question

I am trying to delay the loading of this chat script on my website but cannot get it to work for some reason.

console.log(script) returns the correctly dynamically generated script but for some reason the script (live chat) is not running on the page.

I have removed some content for privacy but here is my code:

HTML

<!DOCTYPE html>
<%@ LANGUAGE="VBSCRIPT" %>
<html lang="en-US">
<head>

    <meta charset="utf-8">
    <meta name="robots" content="noindex, nofollow">
    <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
    <meta name="description" content="Website Description">

    <title>Website</title>

    <link rel="alternate" href="https://www.website.com/website" hreflang="x-default"/>
    <link rel="canonical" href="https://www.website.com/website">

    <!--#INCLUDE VIRTUAL="/codeanalytics/google.htm"-->
    <!--#INCLUDE VIRTUAL="/_borders17/assets/css-files.html"-->
    <!--#INCLUDE VIRTUAL="/_borders17/website-2018-form-validation.html"-->


    <%
        FormHeader = "Request Demo Now"
        FormBtn = "Get Demo Now"

        sub Process
            Interest = "Demo Request: Website - mrkt"

            WebComment = Comments
            CSR = UserLog(Interest, "DQT")
            Message = Comments & vbCrLf
            Message = Message & " Name: " & Name & vbCrLf
            Message = Message & " Email: " & email & vbCrLf
            Message = Message & " Phone: " & Phone & vbCrLf
            Message = Message & " Company: " & Company & vbCrLf
            Message = Message & " Product: " & Interest & " " & vbCrLf
            Message = Message & " GDPR Agreement: " & Agreement & Checked & gdpragree & vbCrLf
            Message = Message & " Referrer: " & REFERER & vbCrLf & vbCrLf
            message = message + Ip2Message & vbCrLf & vbCrLf
            result = Mail("[email protected]", emailfrom, Interest  & " " & Reg & " " & IpCountry & " " & Csr, Message )
        end sub
    %>

</head>
<body>

    <!--#INCLUDE VIRTUAL="/codeanalytics/google-tag-manager-body.htm"-->
    <!--#INCLUDE VIRTUAL="/_borders17/nav/2018/nav.html"-->

    <main>
        <section>

            <!-- HTML CONTENT HERE -->

        </section>
    </main>

    <!--#INCLUDE VIRTUAL="/_borders17/footer/2018/footer.html"-->
    <!--#INCLUDE VIRTUAL="/_borders17/assets/js-files.html"-->

    <script>

        setTimeout(function() {
            var script = document.createElement('script');
            script.type = "text/javascript";
            script.setAttribute("id", "6461f488b9172537ed0bfce1966c165e");
            script.src = "//support.website.com/script.php?id=6461f488b9172537ed0bfce1966c165e";
            console.log(script);
            document.querySelector('head').appendChild(script);
        }, 5000);

    </script>

</body>
</html>
<% sub Form%>
<%end sub%>

JS

    setTimeout(function() {
        var script = document.createElement('script');
        script.type = "text/javascript";
        script.setAttribute("id", "6461f488b9172537ed0bfce1966c165e");
        script.src = "//support.website.com/script.php?id=6461f488b9172537ed0bfce1966c165e";
        console.log(script);
        document.querySelector('head').appendChild(script);
    }, 5000);

The error is in your document.getElementsByTagName('head')[0].appendChild(script);. May put a console.log(script), before that line? — Esdras Xavier
– Esdras Xavier, Commented Feb 28, 2019 at 18:58
At the top of the script add: console.log(document.getElementsByTagName('head').length) - if it's 0 then you don't have a <head> section, which would also give this error. Add a <head> section to your page. — fdomn-m
– fdomn-m, Commented Feb 28, 2019 at 19:02
I already have a <head> inside of my HTML document & when I put the script on the top it returns 1. — Khan
– Khan, Commented Feb 28, 2019 at 20:11

Kamil Kiełczewski · Accepted Answer · 2019-03-01 06:04:30Z

Add <head> tag in your html and it will work (run and look in chrome console ) and remember that your script should be defined below that tag.

setTimeout(function() {
    var script = document.createElement('script');
    script.src = "//support.website.com/script.php?id=6461f488b9172537ed0bfce1966c165e";
    script.type = "text/javascript";
    script.setAttribute("id", "6461f488b9172537ed0bfce1966c165e");    
    document.getElementsByTagName('head')[0].appendChild(script);
}, 50);

<head>xxx</head>

After question upate

I put your full code (after question update) into snippet and it works without error you mention in previous versions of your question

Uncaught TypeError: Cannot read property 'appendChild' of null.

Here is snippet

<!DOCTYPE html>
<%@ LANGUAGE="VBSCRIPT" %>
<html lang="en-US">
<head>

    <meta charset="utf-8">
    <meta name="robots" content="noindex, nofollow">
    <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
    <meta name="description" content="Website Description">

    <title>Website</title>

    <link rel="alternate" href="https://www.website.com/website" hreflang="x-default"/>
    <link rel="canonical" href="https://www.website.com/website">

    <!--#INCLUDE VIRTUAL="/codeanalytics/google.htm"-->
    <!--#INCLUDE VIRTUAL="/_borders17/assets/css-files.html"-->
    <!--#INCLUDE VIRTUAL="/_borders17/website-2018-form-validation.html"-->


    <%
        FormHeader = "Request Demo Now"
        FormBtn = "Get Demo Now"

        sub Process
            Interest = "Demo Request: Website - mrkt"

            WebComment = Comments
            CSR = UserLog(Interest, "DQT")
            Message = Comments & vbCrLf
            Message = Message & " Name: " & Name & vbCrLf
            Message = Message & " Email: " & email & vbCrLf
            Message = Message & " Phone: " & Phone & vbCrLf
            Message = Message & " Company: " & Company & vbCrLf
            Message = Message & " Product: " & Interest & " " & vbCrLf
            Message = Message & " GDPR Agreement: " & Agreement & Checked & gdpragree & vbCrLf
            Message = Message & " Referrer: " & REFERER & vbCrLf & vbCrLf
            message = message + Ip2Message & vbCrLf & vbCrLf
            result = Mail("[email protected]", emailfrom, Interest  & " " & Reg & " " & IpCountry & " " & Csr, Message )
        end sub
    %>

</head>
<body>

    <!--#INCLUDE VIRTUAL="/codeanalytics/google-tag-manager-body.htm"-->
    <!--#INCLUDE VIRTUAL="/_borders17/nav/2018/nav.html"-->

    <main>
        <section>

            <!-- HTML CONTENT HERE -->

        </section>
    </main>

    <!--#INCLUDE VIRTUAL="/_borders17/footer/2018/footer.html"-->
    <!--#INCLUDE VIRTUAL="/_borders17/assets/js-files.html"-->

    <script>

        setTimeout(function() {
            console.log('xx');
            var script = document.createElement('script');
            script.type = "text/javascript";
            script.setAttribute("id", "6461f488b9172537ed0bfce1966c165e");
            script.src = "//support.website.com/script.php?id=6461f488b9172537ed0bfce1966c165e";
            console.log(script);
            document.querySelector('head').appendChild(script);
        }, 5000);

    </script>

</body>
</html>
<% sub Form%>
<%end sub%>

When you run it and go to chrome element inspector you will notice that your script appear in snippet <head> tag (I also add console.log('xx') to yur js to be sure that your script was executed):

If you error stop appear (because in this version of your question you remove it) and live chat still not works, then this is separate problem and find/ask another question in StackOverflow (put there also your script //support.website.com/script.php?id=6... content )

I think you had it with your original comment - there's no <head> section - add a snippet without <head> and it will show the same error.
I have already added the <head> tag in my HTML & the script is placed right before the ending </body> tag.
You are right, the problem is with the live chat & is a completely separate problem, but thank you for your response.

Steven Spungin · Accepted Answer · 2019-02-28 19:08:37Z

1

Load or run your script at the end of your body, just before your body end tag.

answered Feb 28, 2019 at 19:08

Steven Spungin

29.5k7 gold badges97 silver badges85 bronze badges

3 Comments

Khan Over a year ago

The script is already placed right before the ending </body> tag.

Steven Spungin Over a year ago

Post your HTML please.

Steven Spungin Over a year ago

Now your error has changed. Before it was element not found. Now you state script will not run. You now need to post your console log.

Miroslav Glamuzina · Accepted Answer · 2019-02-28 23:22:11Z

1

Use document.querySelector() if you are trying to access one element. This way you don't have to access the head by index. Also, unless you have to have the script imported by this time, it's usually best to add scripts near the bottom of the document.

This should work:

setTimeout(function() {
  var script = document.createElement('script');
  script.src = "//support.website.com/script.php?id=6461f488b9172537ed0bfce1966c165e";
  script.type = "text/javascript";
  script.setAttribute("id", "6461f488b9172537ed0bfce1966c165e");
  document.querySelector('head').appendChild(script);
}, 5000);

<head></head>

Also, ensure a <head/> tag exists.

My VBScript skills are not great, but try adding something like this to your script like so:

<script type="text/vbscript">
    Sub mySub
       Set script = document.createElement('script');
       script.src = "//support.website.com/script.php?id=6461f488b9172537ed0bfce1966c165e";
       script.type = "text/javascript";
       script.setAttribute("id", "6461f488b9172537ed0bfce1966c165e");
       document.querySelector('head').appendChild(script);
    End Sub
    window.setTimeout "mySub()", 50000, "VBScript"
</script>

Hope this helps,

edited Feb 28, 2019 at 23:22

answered Feb 28, 2019 at 19:02

Miroslav Glamuzina

4,5872 gold badges23 silver badges33 bronze badges

2 Comments

Khan Over a year ago

I have added the document.querySelector & console.log(script) & it logs the script properly but I still get the - Uncaught TypeError: Cannot read property 'appendChild' of null error.

Miroslav Glamuzina Over a year ago

Are you able to append this script on a different element?

Collectives™ on Stack Overflow

Delay loading of script

3 Answers 3

After question upate

3 Comments

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

After question upate

3 Comments

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related