Использование JavaScript в первый раз

Использование JavaScript в первый раз

Последние две недели я использую и изучаю JS. Это было сложно, я новичок в программировании, и мне пришлось значительно расширить свою терпимость к фрустрации, чтобы обойти ошибки типов, синтаксические ошибки и все другие ошибки.

За это время я научился разбивать цели, или, скорее, мою целевую пользовательскую интерактивность, на ряд более мелких достижимых/удобных для Google строк кода.

Ниже приведены несколько строк кода, которые я недавно написал, чтобы а) двигаться по проекту и б) более конкретно «переворачивать» карты или элементы div, которые я ранее создал, обратно.

var resetCards = function (e){
console.log('сбросьте карты, пожалуйста');
var el = document.querySelectorAll('.card img');
for (var i =0;i‹cardsInPlay.length;i++){
el[i].style.visibility='hidden'
};
};

Первое, что мне нужно было сделать, это объявить функцию. Затем я использовал символ «e» в качестве параметра для ссылки на событие, которое я написал ранее.

Затем я использовал console.log, чтобы протестировать свой код и убедиться, что браузер обращается к новой функции, которую я вызывал ранее в коде.

Убедившись, что код работает, я установил переменную, чтобы определить атрибут CSS, который я буду изменять. Затем я изменил этот CSS, используя цикл for. Этот цикл изменил CSS после запуска исходного события, и пользователю был предоставлен ответ на основе его действий. Цикл ссылается на глобальный массив, использовавшийся ранее в приложении, и использует JavaScript для изменения CSS-атрибута «видимость».

Это может показаться не таким уж большим, но в сочетании с остальным кодом для меня это было очень важно.

А теперь немного сломанного кода, чтобы показать, что у меня впереди.

var isMatch = функция (е) {

console.log(cardsInPlay[0]);
console.log(cardsInPlay[1]);
console.log(cardsInPlay[0] ===cardsInPlay[1]);

если (cardsInPlay[0] ===cardsInPlay[1]) {

// добавляем «ЭТО МАТЧ» в текст страницы
document.getElementById(«game-text»).innerHTML= «ЭТО МАТЧ»;
// var dog;
// function thisFunction (){
// dog = setTimeout(deletePair(), 1500);
// }
function deletePair(e) {
console.log(“ удалить эту пару”);
var parent = document.getElementsByClassName('board');
var child = document.getElementById('div');
parent.removeChild(child);

Выше я пытаюсь удалить пары с игрового поля после того, как они открыты.

Как видите, я снова веду консольный журнал, чтобы убедиться, что браузер читает функцию.

Я также объявляю новую функцию и объявляю переменные для дальнейшего управления DOM.

Прямо сейчас мне нужно покопаться в Интернете и узнать, как удалить определенный HTML-контент.

Программирование — это ряд задач, разбитых на множество более мелких задач. Даже когда я продолжу писать более сложную логику с помощью JS, я всегда буду использовать этот проект как источник уверенности и рабочий пример того, как важно разбивать и измельчать опыт взаимодействия с пользователем.