При клике на елемент появляется строка цвета фона

#javascript #html

    window.onload = function() {
      "use strict";
      var Doshka = document.createElement('DIV');
      Doshka.className = "Doshka";
      document.getElementById('chess').appendChild(Doshka);
      //document.body.appendChild(Doshka);
      var ji = document.querySelector('img');
      var m = 1;
      var g = 8;
      var attrt, cordinatesp;

      var cordinates = [
        [1,8],[2,8],[3,8],[4,8],[5,8],[6,8],[7,8],[8,8],
        [1,7],[2,7],[3,7],[4,7],[5,7],[6,7],[7,7],[8,7],
        [1,6],[2,6],[3,6],[4,6],[5,6],[6,6],[7,6],[8,6],
        [1,5],[2,5],[3,5],[4,5],[5,5],[6,5],[7,5],[8,5],
        [1,4],[2,4],[3,4],[4,4],[5,4],[6,4],[7,4],[8,4],
        [1,3],[2,3],[3,3],[4,3],[5,3],[6,3],[7,3],[8,3],
        [1,2],[2,2],[3,2],[4,2],[5,2],[6,2],[7,2],[8,2],
        [1,1],[2,1],[3,1],[4,1],[5,1],[6,1],[7,1],[8,1]
      ];
      var DoshkaSel = document.querySelector('.Doshka');
      for (var i = 0; i < 64; i++) {
        var klitynka = document.createElement('DIV');
        var figure = document.createElement('IMG');
        if (i % 8) {
          m += 1;
          g -= 1;
        }
        if (m % 2) {
          klitynka.className = "KlitN";
        } else {
          klitynka.className = "Klit";
        }
        klitynka.id = i;
        DoshkaSel.appendChild(klitynka);
        klitynka.appendChild(figure);
        figure.onclick = function Choosing(event) {
          attrt = event.target.getAttribute('src');
          event.target.setAttribute('src', '');
          cordinatesp = klitynka.getAttribute('id');
        };
        switch (i) {
          case 0:
            figure.setAttribute('src', 'https://cdnw.nickpic.host/mMym9J.png')
            break;
          case 7:
            figure.setAttribute('src', '55.gif')
            break;
          case 1:
            figure.setAttribute('src', '44.gif')
            break;
          case 6:
            figure.setAttribute('src', '44.gif')
            break;
          case 2:
            figure.setAttribute('src', '33.gif')
            break;
          case 5:
            figure.setAttribute('src', '33.gif')
            break;
          case 3:
            figure.setAttribute('src', '77.gif')
            break;
          case 4:
            figure.setAttribute('src', '66.gif')
            break;
          case 8:
            figure.setAttribute('src', 'https://cdnw.nickpic.host/mMym9J.png')
            break;
          case 9:
            figure.setAttribute('src', '11.png')

            break;
          case 10:
            figure.setAttribute('src', '11.png')


            break;
          case 11:
            figure.setAttribute('src', '11.png')


            break;
          case 12:
            figure.setAttribute('src', '11.png')


            break;
          case 13:
            figure.setAttribute('src', '11.png')


            break;
          case 14:
            figure.setAttribute('src', '11.png')


            break;
          case 15:
            figure.setAttribute('src', '11.png')


            break;
          case 63:
            figure.setAttribute('src', '5.gif')


            break;
          case 56:
            figure.setAttribute('src', '5.gif')


            break;
          case 62:
            figure.setAttribute('src', '4.gif')


            break;
          case 57:
            figure.setAttribute('src', '4.gif')


            break;
          case 61:
            figure.setAttribute('src', '3.gif')


            break;
          case 58:
            figure.setAttribute('src', '3.gif')


            break;
          case 60:
            figure.setAttribute('src', '6.jpeg')


            break;
          case 59:
            figure.setAttribute('src', '7.gif')
            break;
          case 55:
            figure.setAttribute('src', '1.png')
            break;
          case 54:
            figure.setAttribute('src', '1.png')
            break;
          case 53:
            figure.setAttribute('src', '1.png')
            break;
          case 52:
            figure.setAttribute('src', '1.png')
            break;
          case 51:
            figure.setAttribute('src', '1.png')
            break;
          case 50:
            figure.setAttribute('src', '1.png')
            break;
          case 49:
            figure.setAttribute('src', '1.png')
            break;
          case 48:
            figure.setAttribute('src', '1.png')
            break;
        }
      }
    }
    .Doshka {
      width: 640px;
      height: 640px;
      background-color: red;
      border: 1px solid black;
    }

    .Klit {
      width: 80px;
      height: 80px;
      background-color: white;
      display: inline-block;
    }

    .KlitN {
      width: 80px;
      height8: 80px;
      display: inline-block;
    }
    




    

Ответы

Ответ 1

Цвет клеток никакого отношения к этому поведению не имеет. 

    figure.onclick = function Choosing(event) {
      attrt = event.target.getAttribute('src');
      //event.target.setAttribute('src', '');
      event.target.style.display = "none";
      cordinatesp = event.target.parentNode.getAttribute('id');
    };

.Doshka img {
  vertical-align:middle;
}