Please help me to see why this JS code reported an error.

related codes

/ / Please paste the code text below (do not replace the code with pictures)

<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>2</title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        html,
        body {
            position: relative;
            background: url(images/bg.jpg);
            background-size: cover;
        }

        div {
            position: absolute;

        }

        -sharpscores,
        -sharptime {
            color: white;
            font-size: 20px;
            line-height: 150%;
            font-style: normal;
        }
    </style>
</head>

<body>

    <h1 id="scores">:0</h1>
    <p id="time">:


    <script type="text/javascript">
        //
        var scores = document.getElementById("scores");
        //
        var time = document.getElementById("time");
        //
        var useful = true;
        //
        var scoress = 0;
        //
        var times = 30000;




        // ballon
        function Ballon(score, color) {

            this.score = score + 1;

            //
            this.left = parseInt(Math.random() * 1900);
            this.top = 700;
            this.width = 100;
            this.height = 100;
            this.color = color;



            //
            this.dom = document.createElement("div");
            document.body.appendChild(this.dom);

            //
            // this.render(color);
            //
            this.fly();

            //
            var This = this;
            this.dom.onmousedown = function () {
                This.kill();
                // console.log(This.score,scoress);
                scoress += This.score;
                scores.innerHTML = ":" + scoress;
            };


        }

        Ballon.prototype.render = function () {
            this.dom.style.left = this.left + "px";
            this.dom.style.top = this.top + "px";
            this.dom.style.width = this.width + "px";
            this.dom.style.height = this.height + "px";
            this.dom.style.backgroundColor = this.color;
        }

        Ballon.prototype.fly = function () {
            var s = this.score * 1;
            var This = this;
            nn = 0;
            this.timer = setInterval(function () {
                This.top -= s;
                if (This.top < -500 || useful == false) {
                    clearInterval(This.timer);
                    This.kill();
                }
                This.render();
                
            }, 10);
            
            
        }
        Ballon.prototype.kill = function () {
            document.body.removeChild(this.dom);
        }

        //
        var game = setInterval(function () {
            //
            var rd = parseInt(Math.random() * 10);
            //
            var clArr = ["red", "black", "green", "blue", "skyblue", "pink", "grennyellow", "orange", "gray",
                "fuchsia"
            ];
            var cl = clArr[rd];

            new Ballon(rd, cl);

        }, 500);

        //

        var count = setInterval(function () {
            time.innerHTML = ":" + times / 1000;

            if (times / 1000 <= 0) {
                clearInterval(game);
                clearInterval(count);
                useful = false;
                alert("" + scoress + "!");
            }
            times -= 1000;
        }, 1000)
    </script>
</body>

</html>

What is the error message that

actually sees?

cycle accumulation
Uncaught DOMException: Failed to execute "removeChild" on" Node": The node to be removed is not a child of this node.

problem description

this is a mouse click moving square Mini Game, the program randomly generates different speed squares to move up, click to break the square score. There is no problem with the realization of the function, but now there is a great loss of resources, and I have reported an error. I have been looking for a long time to find out the reason. I hope that the master will be extremely grateful for her advice.

the environmental background of the problems and what methods you have tried

I moved the clearInterval (This.timer) of line 108 to line 118, which seemed to avoid reporting an error, but I couldn"t find a reasonable explanation for why the clearInterval would fail. Thank you very much for your advice!

thanks to
Xeira and realwugang for pointing out the error, but the error will still be reported in the trial game after correction. At present, it seems that the error can only be avoided by moving clearInterval (This.timer) to line 118. please point out the reason.

Ballon.prototype.fly = function () { var s = this.score * 1; var This = this; nn = 0; this.timer = setInterval(function () { This.top -= s; if (This.top < -500 || useful == false) { clearInterval(this.timer); This.kill(); }else{ This.render(); } }, 100); }

Ballon.prototype.fly = function () { var s = this.score * 1; var This = this; nn = 0; this.timer = setInterval(function () { This.top -= s; if (This.top < -500 || useful == false) { clearInterval(This.timer); this.dom && This.kill(); } else { This.render(); } }, 10); }