Why is the expected " SCRIPT1004: ';' error" generated when running the application in Internet Explorer?

Asked

Viewed 175 times

0

I recently created a Javascript application that works perfectly in the browser Chrome and yesterday I decided to test it on Internet Explorer.

To my surprise, the page was not the way it should be and besides, when opening the browser console I came across this stack of errors:

SCRIPT1004: ';' esperado
Arquivo: main.js Linha: 74 Coluna: 20
SCRIPT1006: ')' esperado
Arquivo: progressBar.js Linha: 12 Coluna: 45
SCRIPT1006: ')' esperado
Arquivo: stopwatch.js Linha: 30 Coluna: 47
SCRIPT5009: 'createTriangle' não está definido
Arquivo: index.html Linha: 34 Coluna: 13

On the tab scrubber it shows the following error:

'createTriangle' is not defined

Below is a piece of my code (my entire code is here on Github) which is the part where the browser points to the error:

function createTriangle(element){

    var triangle = document.createElement("div");
    triangle.setAttribute("class","triangle-right");
    element.appendChild(triangle);

    triangle.style.left = element.offsetWidth / 2 - triangle.offsetWidth / 2 + "px";
    triangle.style.top = element.offsetHeight / 2 - triangle.offsetHeight / 2 + "px";
}

function removeAllChild(element){

    for (let child of element.children){
        element.removeChild(child);
    }
}
<!DOCTYPE html>

<html>
    <head>
        <meta charset="UTF-8">
        <title>Stopwatch</title>
        <link rel="stylesheet" type="text/css" href="./css/style.css">
        <script type="text/javascript" src="./js/main.js"></script>
    </head>

    <body>
        <div style="position: absolute; top: 70%;">
            <button align="center" id="button"></button>
        <div>

        <script>
            var button = document.getElementById("button");
            createTriangle(button);
        </script>
    </body>
</html>

I have reviewed the code several times and I am sure that there is no missing semicolon or parentheses anywhere in the code. So what could be generating this error ?

javascript internet-explorer syntax-error

1 answer

4


The for..of is not supported by IE, I mean this:

for (let child of element.children){

The let is partially supported by IE11, adjustment for:

for (var i = element.children.length - 1; i >= 0; i--) {
    element.removeChild(element.children[i]);
}

The loop has to be backwards because each time an element is removed the index is "readjusted"

Take advantage and isolate what is mathematical operation from what is "concatenation" isolating with (...) 

triangle.style.left = (element.offsetWidth / 2 - triangle.offsetWidth / 2) + "px";
triangle.style.top = (element.offsetHeight / 2 - triangle.offsetHeight / 2) + "px";

It is good to be careful with mathematical operations as well and isolate, because then you will not mess with operators who have "priority"

  • Thanks for the explanation and the tip!

Browser other questions tagged javascript internet-explorer syntax-error

You are not signed in. Login or sign up in order to post.