JavaScript HTML CSS ve JavaScript ile zar oyunu yapılıyor fakat çalışmıyor

J

joeblackdf

Decapat
Katılım
8 Haziran 2023
Mesajlar
57
Daha fazla  
Cinsiyet
Erkek
JavaScript ile zar oyunu yapıyorum fakat çalışmıyor

'
Kod: 
Use strict';
Const Player0El = document. QuerySelector('Player--0');
Const Player1El = document. QuerySelector('Player--1');
Const score0El = document. QuerySelector('#score--0');
Const score1El = document. QuerySelector('#score--1');
Const current0El = document. GetElementById('current--0');
Const current1El = document. GetElementById('current--1');
Const diceEl = document. QuerySelector('.dice');
Const btnNew = document. QuerySelector('.btn--New');
Const btnRoll = document. QuerySelector('.btn--roll');
Const btnHold = document. QuerySelector('.btn--hold');
Let scores, currentScore, activePlayer, playing;
Const init = function(){
 Scores[0,0];
 CurrentScore = 0;
 ActivePlayer = 0;
 Playing = true;

 Score0El. TextContent = 0;
 Score1El. TextContent = 0;
 Current0El. TextContent = 0;
 Current1El. TextContent = 0;
 DiceEl. ClassList. Add('hidden');
 Player0El. ClassList. Remove('Player--active');
 Player1El. ClassList. Remove('Player--active');
};
init();
Const switchPlayer = function(){
 Document. GetElementById('current--${activePlayer}').textContent = 0;
 CurrentScore = 0;
 ActivePlayer === 0?1:0;
 Player0El. ClassList. Toggle('Player--active');
 Player1El. ClassList. Toggle('Player--active');

};
BtnRoll. AddEventListener('Click',function(){
 İf(playing){
 Const dice = Math.trunc(Math.random()*6) + 1;

 DiceEl. ClassList. Remove('hidden');
 DiceEl. Src= 'dice-${dice}.PNG';
 İf(dice!==1){
 CurrentScore +=dice;
 Document. GetElementById('current--${activePlayer}').textContent = currentScore;
 }
 Else{
 switchPlayer();

 }
}

});
BtnHold. AddEventListener('Click',function(){
 İf(playing){
 Scores[activePlayer] += currentScore;
 Document. GetElementById('score--${activePlayer}').textContent = scores[activePlayer];""
 İf(scores[activePlayer]>=100){
 Playing = false;
 DiceEl. ClassList. Add('hidden');
 Document. QuerySelector('.Player--${activePlayer}').classList. Add('.Player--winner');
 Document. QuerySelector('.Player--${activePlayer}').classList. Remove('Player--active');
 }
 Else{
 switchPlayer();
 }
 }
});
BtnNew. AddEventListener('Click',init);

[CODE=javascript]
[/CODE]
 

Dosya Ekleri

  • Ekran görüntüsü 2024-08-11 184635.png
    Ekran görüntüsü 2024-08-11 184635.png
    526 KB · Görüntüleme: 67
Tarihe göre sırala Puana göre sırala
joeblackdf dedi:
JavaScript ile zar oyunu yapıyorum fakat çalışmıyor

'
Kod: 
Use strict';
Const Player0El = document. QuerySelector('Player--0');
Const Player1El = document. QuerySelector('Player--1');
Const score0El = document. QuerySelector('#score--0');
Const score1El = document. QuerySelector('#score--1');
Const current0El = document. GetElementById('current--0');
Const current1El = document. GetElementById('current--1');
Const diceEl = document. QuerySelector('.dice');
Const btnNew = document. QuerySelector('.btn--New');
Const btnRoll = document. QuerySelector('.btn--roll');
Const btnHold = document. QuerySelector('.btn--hold');
Let scores, currentScore, activePlayer, playing;
Const init = function(){
 Scores[0,0];
 CurrentScore = 0;
 ActivePlayer = 0;
 Playing = true;

 Score0El. TextContent = 0;
 Score1El. TextContent = 0;
 Current0El. TextContent = 0;
 Current1El. TextContent = 0;
 DiceEl. ClassList. Add('hidden');
 Player0El. ClassList. Remove('Player--active');
 Player1El. ClassList. Remove('Player--active');
};
init();
Const switchPlayer = function(){
 Document. GetElementById('current--${activePlayer}').textContent = 0;
 CurrentScore = 0;
 ActivePlayer === 0?1:0;
 Player0El. ClassList. Toggle('Player--active');
 Player1El. ClassList. Toggle('Player--active');

};
BtnRoll. AddEventListener('Click',function(){
 İf(playing){
 Const dice = Math.trunc(Math.random()*6) + 1;

 DiceEl. ClassList. Remove('hidden');
 DiceEl. Src= 'dice-${dice}.PNG';
 İf(dice!==1){
 CurrentScore +=dice;
 Document. GetElementById('current--${activePlayer}').textContent = currentScore;
 }
 Else{
 switchPlayer();

 }
}

});
BtnHold. AddEventListener('Click',function(){
 İf(playing){
 Scores[activePlayer] += currentScore;
 Document. GetElementById('score--${activePlayer}').textContent = scores[activePlayer];""
 İf(scores[activePlayer]>=100){
 Playing = false;
 DiceEl. ClassList. Add('hidden');
 Document. QuerySelector('.Player--${activePlayer}').classList. Add('.Player--winner');
 Document. QuerySelector('.Player--${activePlayer}').classList. Remove('Player--active');
 }
 Else{
 switchPlayer();
 }
 }
});
BtnNew. AddEventListener('Click',init);

[CODE=javascript]
[/CODE]
Genişletmek için tıkla...
Selamlar, attığınız kodu iyi bir şekilde inceledim,

Sanırım sadece js. kısmında problem yaşıyorsunuz ve kodlamanızda birkaç yazım hatası bulunuyor, bunlardan birkaçı şu şekilde :

1. Kod terimlerini büyük harfle yazmayın.

2. Grup terimlerini büyük harfle yazmayın.

3. Nde. sonrası dot. kullanın

4. Alt mesajlar ekleyerek kodunuzun nerede çalışmayı durduğunu bulun ve debug ( hata analizi ) yapın, kodun düzeltilmiş hali şu şekildedir :

JavaScript: 
'use strict';


// Seçici öğeler
const player0El = document.querySelector('.player--0');
const player1El = document.querySelector('.player--1');
const score0El = document.querySelector('#score--0');
const score1El = document.querySelector('#score--1');
const current0El = document.getElementById('current--0');
const current1El = document.getElementById('current--1');
const diceEl = document.querySelector('.dice');
const btnNew = document.querySelector('.btn--new');
const btnRoll = document.querySelector('.btn--roll');
const btnHold = document.querySelector('.btn--hold');


// Başlangıç durumu
let scores, currentScore, activePlayer, playing;


const init = function() {
  scores = [0, 0];
  currentScore = 0;
  activePlayer = 0;
  playing = true;


  score0El.textContent = 0;
  score1El.textContent = 0;
  current0El.textContent = 0;
  current1El.textContent = 0;
  diceEl.classList.add('hidden');
  player0El.classList.add('player--active');
  player1El.classList.remove('player--active');
};


init();


const switchPlayer = function() {
  document.getElementById(`current--${activePlayer}`).textContent = 0;
  currentScore = 0;
  activePlayer = activePlayer === 0 ? 1 : 0;
  player0El.classList.toggle('player--active');
  player1El.classList.toggle('player--active');
};


btnRoll.addEventListener('click', function() {
  if (playing) {
    const dice = Math.trunc(Math.random() * 6) + 1;


    diceEl.classList.remove('hidden');
    diceEl.src = `dice-${dice}.png`;
    
    if (dice !== 1) {
      currentScore += dice;
      document.getElementById(`current--${activePlayer}`).textContent = currentScore;
    } else {
      switchPlayer();
    }
  }
});


btnHold.addEventListener('click', function() {
  if (playing) {
    scores[activePlayer] += currentScore;
    document.getElementById(`score--${activePlayer}`).textContent = scores[activePlayer];


    if (scores[activePlayer] >= 100) {
      playing = false;
      diceEl.classList.add('hidden');
      document.querySelector(`.player--${activePlayer}`).classList.add('player--winner');
      document.querySelector(`.player--${activePlayer}`).classList.remove('player--active');
    } else {
      switchPlayer();
    }
  }
});


btnNew.addEventListener('click', init);
 
Artı 0 Eksi
Kodunuzda hatalar var.
JavaScript: 
'use strict';

const Player0El = document.querySelector('.Player--0');
const Player1El = document.querySelector('.Player--1');
const score0El = document.querySelector('#score--0');
const score1El = document.querySelector('#score--1');
const current0El = document.getElementById('current--0');
const current1El = document.getElementById('current--1');
const diceEl = document.querySelector('.dice');
const btnNew = document.querySelector('.btn--New');
const btnRoll = document.querySelector('.btn--roll');
const btnHold = document.querySelector('.btn--hold');

let scores = [0, 0];
let currentScore = 0;
let activePlayer = 0;
let playing = true;

const init = function () {
  scores = [0, 0];
  currentScore = 0;
  activePlayer = 0;
  playing = true;

  score0El.textContent = 0;
  score1El.textContent = 0;
  current0El.textContent = 0;
  current1El.textContent = 0;
  diceEl.classList.add('hidden');
  Player0El.classList.remove('Player--active');
  Player1El.classList.remove('Player--active');
  Player0El.classList.add('Player--active');
};

init();

const switchPlayer = function () {
  document.getElementById(`current--${activePlayer}`).textContent = 0;
  currentScore = 0;
  activePlayer = activePlayer === 0 ? 1 : 0;
  Player0El.classList.toggle('Player--active');
  Player1El.classList.toggle('Player--active');
};

btnRoll.addEventListener('click', function () {
  if (playing) {
    const dice = Math.trunc(Math.random() * 6) + 1;

    diceEl.classList.remove('hidden');
    diceEl.src = `dice-${dice}.png`;
    if (dice !== 1) {
      currentScore += dice;
      document.getElementById(`current--${activePlayer}`).textContent = currentScore;
    } else {
      switchPlayer();
    }
  }
});

btnHold.addEventListener('click', function () {
  if (playing) {
    scores[activePlayer] += currentScore;
    document.getElementById(`score--${activePlayer}`).textContent = scores[activePlayer];
    if (scores[activePlayer] >= 100) {
      playing = false;
      diceEl.classList.add('hidden');
      document.querySelector(`.Player--${activePlayer}`).classList.add('Player--winner');
      document.querySelector(`.Player--${activePlayer}`).classList.remove('Player--active');
    } else {
      switchPlayer();
    }
  }
});

btnNew.addEventListener('click', init);
 
Artı 0 Eksi
darkinbox dedi:
Selamlar, attığınız kodu iyi bir şekilde inceledim,

Sanırım sadece js. kısmında problem yaşıyorsunuz ve kodlamanızda birkaç yazım hatası bulunuyor, bunlardan birkaçı şu şekilde :

1. Kod terimlerini büyük harfle yazmayın.

2. Grup terimlerini büyük harfle yazmayın.

3. Nde. sonrası dot. kullanın

4. Alt mesajlar ekleyerek kodunuzun nerede çalışmayı durduğunu bulun ve debug ( hata analizi ) yapın, kodun düzeltilmiş hali şu şekildedir :

JavaScript: 
'use strict';


// Seçici öğeler
const player0El = document.querySelector('.player--0');
const player1El = document.querySelector('.player--1');
const score0El = document.querySelector('#score--0');
const score1El = document.querySelector('#score--1');
const current0El = document.getElementById('current--0');
const current1El = document.getElementById('current--1');
const diceEl = document.querySelector('.dice');
const btnNew = document.querySelector('.btn--new');
const btnRoll = document.querySelector('.btn--roll');
const btnHold = document.querySelector('.btn--hold');


// Başlangıç durumu
let scores, currentScore, activePlayer, playing;


const init = function() {
  scores = [0, 0];
  currentScore = 0;
  activePlayer = 0;
  playing = true;


  score0El.textContent = 0;
  score1El.textContent = 0;
  current0El.textContent = 0;
  current1El.textContent = 0;
  diceEl.classList.add('hidden');
  player0El.classList.add('player--active');
  player1El.classList.remove('player--active');
};


init();


const switchPlayer = function() {
  document.getElementById(`current--${activePlayer}`).textContent = 0;
  currentScore = 0;
  activePlayer = activePlayer === 0 ? 1 : 0;
  player0El.classList.toggle('player--active');
  player1El.classList.toggle('player--active');
};


btnRoll.addEventListener('click', function() {
  if (playing) {
    const dice = Math.trunc(Math.random() * 6) + 1;


    diceEl.classList.remove('hidden');
    diceEl.src = `dice-${dice}.png`;
  
    if (dice !== 1) {
      currentScore += dice;
      document.getElementById(`current--${activePlayer}`).textContent = currentScore;
    } else {
      switchPlayer();
    }
  }
});


btnHold.addEventListener('click', function() {
  if (playing) {
    scores[activePlayer] += currentScore;
    document.getElementById(`score--${activePlayer}`).textContent = scores[activePlayer];


    if (scores[activePlayer] >= 100) {
      playing = false;
      diceEl.classList.add('hidden');
      document.querySelector(`.player--${activePlayer}`).classList.add('player--winner');
      document.querySelector(`.player--${activePlayer}`).classList.remove('player--active');
    } else {
      switchPlayer();
    }
  }
});


btnNew.addEventListener('click', init);
Genişletmek için tıkla...
Teşekkür ediyorum incelediğiniz için ama herhangi bir hata göstermiyor evet JS kodlarında sıkıntı var yeni başladığım için anlayamıyorum nerede hata olduğunu.
 
Artı 0 Eksi
1-) QuerySelector, GetElementById, ClassList gibi fonksiyon ve özellik adları büyük harfle yazılmış. Bu fonksiyon ve özellikler küçük harfle başlamalı. Doğrusu:
  • querySelector
  • getElementById
  • classList
2-) Scores, CurrentScore, ActivePlayer, Playing değişkenleri let ile tanımlanmalı, çünkü const ile tanımlarsanız yeniden atanamazlar.

Düzeltilmiş versiyonu;
Kod: 
'use strict';
const player0El = document.querySelector('.player--0');
const player1El = document.querySelector('.player--1');
const score0El = document.querySelector('#score--0');
const score1El = document.querySelector('#score--1');
const current0El = document.getElementById('current--0');
const current1El = document.getElementById('current--1');
const diceEl = document.querySelector('.dice');
const btnNew = document.querySelector('.btn--new');
const btnRoll = document.querySelector('.btn--roll');
const btnHold = document.querySelector('.btn--hold');


let scores, currentScore, activePlayer, playing;


const init = function () {
  scores = [0, 0];
  currentScore = 0;
  activePlayer = 0;
  playing = true;


  score0El.textContent = 0;
  score1El.textContent = 0;
  current0El.textContent = 0;
  current1El.textContent = 0;


  diceEl.classList.add('hidden');
  player0El.classList.remove('player--winner');
  player1El.classList.remove('player--winner');
  player0El.classList.add('player--active');
  player1El.classList.remove('player--active');
};
init();


const switchPlayer = function () {
  document.getElementById(`current--${activePlayer}`).textContent = 0;
  currentScore = 0;
  activePlayer = activePlayer === 0 ? 1 : 0;
  player0El.classList.toggle('player--active');
  player1El.classList.toggle('player--active');
};


btnRoll.addEventListener('click', function () {
  if (playing) {
    const dice = Math.trunc(Math.random() * 6) + 1;
    diceEl.classList.remove('hidden');
    diceEl.src = `dice-${dice}.png`;


    if (dice !== 1) {
      currentScore += dice;
      document.getElementById(`current--${activePlayer}`).textContent = currentScore;
    } else {
      switchPlayer();
    }
  }
});


btnHold.addEventListener('click', function () {
  if (playing) {
    scores[activePlayer] += currentScore;
    document.getElementById(`score--${activePlayer}`).textContent = scores[activePlayer];


    if (scores[activePlayer] >= 100) {
      playing = false;
      diceEl.classList.add('hidden');
      document.querySelector(`.player--${activePlayer}`).classList.add('player--winner');
      document.querySelector(`.player--${activePlayer}`).classList.remove('player--active');
    } else {
      switchPlayer();
    }
  }
});


btnNew.addEventListener('click', init);
 
Artı 0 Eksi

Benzer konular

bayzeppeli
HTML, CSS ve JavaScript nasıl öğrenilebilir?
Mesaj
6
Görüntüleme
527
Aspectw1
Aspectw1
Yeniçocuk
HTML, CSS ve Javascript eğitim seti önerisi
Mesaj
6
Görüntüleme
6.271
Msi_lover
M
B
HTML CSS ile tasarım yapmak
Mesaj
5
Görüntüleme
543
Beta64
B
erenghlt
HTML CSS loader ekleme
Mesaj
5
Görüntüleme
1.119
erenghlt
erenghlt
C
  • Soru
Görseldeki web sitesini HTML ve CSS kullanarak tasarlama
Mesaj
4
Görüntüleme
455
coderss
C

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı