Достаточно давно, но не супер успешно пытаюсь написать приложение (для игры с друзьями) в вэбе. Задумка, кажется, проста - (гипотетически) есть колода карт, лежащих рубашкой вверх. Из это колоды мы по очереди достаем по карте, где каждая карта что-то значит (для игры и игроков). Процесс продолжается до тех пор, пока колода не иссякнет и затем процесс начинается заново.
В JS я не силен и поэтому возникли сложности. В моей голове это построилось следующим образом - есть массив с 36 элементами (картами), мы рандомом достаем из этого массива по одному элементу (карте) и, показывая его, удаляем. Затем снова рандомно достаем еще один и тоже удаляем. И так до тех пор, пока массив не закончится. Затем игра стартует заново.
Пару месяцев не самой активной вовлеченности и я родил следующий фрагмент когда:
function DoC() {
var arr = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", ];
while (arr.length > 0) {
var rand = Math.floor(Math.random() * arr.length);
var removed = arr.splice(rand, 1);
alert(removed);
}
}
У меня получился рабочий скелет и теперь я загорелся. А вот вопрос у меня такой, - Как реализовать вышеописанное визуально? У меня есть мысль, что нужно добавить кнопку для старта процесса, в файл CSS закинуть 36 изображений карт и дать им свойство TRANSPARENT, и, когда из массива будет выпадать рандомное значение, сравнивать его с таковым в файле CSS и при совпадении, меняя стиль конкретной карты, делать ее видимой.
Правильно ли я мыслю? Если в этом есть логика, то как это реализовать? Ковырял интернет не однажды и все равно не могу понять как должен JS общаться с файлом CSS, обращаться к нему, сравнивать значения и, при необходимости, менять их
