Untitled

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>Переставь фигуры</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <table border=6 align="center" id="TABLE" cellpadding=4 cellspacing=0 >
            <caption>Переставь фигуры</caption>
            <tr> <td>3</td>
                 <td><input type="button" id="button1" value="&#9821" style="width: 50px; height: 50px; font-size: 32px" onClick="onClick(0,0,button1.value)"></td>
                 <td><input type="button" id="button2" value="&#9821" style="width: 50px; height: 50px; font-size: 32px" onclick="onClick(0,1,button2.value)"></td>
                 <td><input type="button" id="button3" value="&#9821" style="width: 50px; height: 50px; font-size: 32px" onclick="onClick(0,2,button3.value)"></td> </tr>
            <tr> <td>2</td>
                 <td><input type="button" id="button4" value="" style="width: 50px; height: 50px; font-size: 32px" onClick="onClick(1,0,button4.value)"></td>
                 <td><input type="button" id="button5" value="" style="width: 50px; height: 50px; font-size: 32px" onclick="onClick(1,1,button5.value)"></td>
                 <td><input type="button" id="button6" value="" style="width: 50px; height: 50px; font-size: 32px" onclick="onClick(1,2,button6.value)"></td> </tr>
            <tr> <td>1</td>
                 <td><input type="button" id="button7" value="&#9816" style="width: 50px; height: 50px; font-size: 32px" onClick="onClick(2,0,button7.value)"></td>
                 <td><input type="button" id="button8" value="&#9816" style="width: 50px; height: 50px; font-size: 32px" onclick="onClick(2,1,button8.value)"></td>
                 <td><input type="button" id="button9" value="&#9816" style="width: 50px; height: 50px; font-size: 32px" onclick="onClick(2,2,button9.value)"></td> </tr>
            <tr> <td></td> <td>a</td> <td>b</td> <td>c</td> </tr>
        </table>

        <script>
            function but(number){
                return document.getElementById(number);
            }

            var ip=1, jp=0,vp="";
            var c=String.fromCharCode(9821);
            var nm = [['button1','button2','buton3'],['button4','button5','button6'],['button7','buton8','button9']];
            function onClick(i,j,v){
                if(vp===String.fromCharCode(9816)&& v===""){
                    if((Math.abs(j-jp)==1 && Math.abs(i-ip)==2) || (Math.abs(j-jp)==2 && Math.abs(i-ip)==1)){
                        but(nm[i][j]).value=vp;
                        but(nm[ip][jp]).value="";
                    }
                }
                if(vp===String.fromCharCode(9821) && v===""){
                    if((Math.abs(j-jp)==1 && Math.abs(i-ip)==1)|(Math.abs(j-jp)==2&&Math.abs(i-ip)==2)){
                        but(nm[i][j]).value=vp;
                        but(nm[ip][jp]).value="";
                    }
                }
                if(but("button4").value==="" && but("button5").value==="" &&
                but("button6").value==="" && but("button7").value===c &&
                but("button8").value===c && but("button9").value===c){
                    alert("Молодец!");
                    window.location.reload(true);
                }

                ip=i;
                jp=j;
                if(i==0&&j==0) vp=but("button1").value;
                if(i==0&&j==1) vp=but("button2").value;
                if(i==0&&j==2) vp=but("button3").value;
                if(i==1&&j==0) vp=but("button4").value;
                if(i==1&&j==1) vp=but("button5").value;
                if(i==1&&j==2) vp=but("button6").value;
                if(i==2&&j==0) vp=but("button7").value;
                if(i==2&&j==1) vp=but("button8").value;
                if(i==2&&j==2) vp=but("button9").value;
            }

        </script>
    </body>
</html>