Bir div öğesinin içinde bilgi görüntüleme

Bunu doğru yapıp yapmadığımı bilmiyorum, ancak gün içinde bu sitede aradığım senaryo döngülerinden sonra tablodaki toplamları görüntülemeye çalışıyorum ama herhangi bir şans vardı. İşte benim kodudur: HTML:Bir div öğesinin içinde bilgi görüntüleme

<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Title</title> 
 
    <script src="script.js" type=J AVASCRIPT></script> 
 
</head> 
 

 
<body> 
 
    Number of simulations: 
 
    <input type="textbox" id="loops"> 
 
    <br> 
 
    <br> 
 
    <input type="button" value="Play" id="play" onClick="simulate()"> 
 
    <br> 
 
    <br> 
 
    <table border="Thick"> 
 
    <tr> 
 
     <td></td> 
 
     <td>Wins</td> 
 
     <td>Percentage</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Player</td> 
 
     <td> 
 
     <div id="playWins" value="test"></div> 
 
     </td> 
 
     <td> 
 
     <div id="playPercent"></div> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>Computer</td> 
 
     <td> 
 
     <div id="comWins"></div> 
 
     <td> 
 
      <div id="comPercent"></div> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>Ties</td> 
 
     <td> 
 
     <div id="ties"></div> 
 
     </td> 
 
     <td> 
 
     <div id="tiesPercent"></div> 
 
     </td> 
 
    </tr> 
 
    </table> 
 
</body> 
 

 
</html>

JavaScript: döngüler değerini elde ederken bir hata mesajı görüyorum

function simulate() { 
 
     var userSelect; 
 
     var comSelect; 
 
     var ties = 0; 
 
     var playWins = 0; 
 
     var comWins = 0; 
 
     var loops; 
 
     var counter = 0; 
 
     loops = document.getElementById("loops").innerHTML; 
 

 
     while (loops > counter) { 
 
     userSelect = new Math.random(); 
 
     if (userSelect < 0.34) { 
 
      userSelect = "rock"; 
 
     } else if (userSelect <= 0.67) { 
 
      userSelect = "paper"; 
 
     } else { 
 
      userSelect = "scissors"; 
 
     } 
 

 
     comSelect = new Math.random(); 
 
     if (comSelect < 0.34) { 
 
      comSelect = "rock"; 
 
     } else if (comSelect <= 0.67) { 
 
      comSelect = "paper"; 
 
     } else { 
 
      comSelect = "scissors"; 
 
     } 
 

 
     if (userSelect == comSelect) { 
 
      ties = ties + 1; 
 
     } else if (((userSelect = "rock") && (comSelect = "scissors")) || ((userSelect = "paper") && (comSelect = "rock")) || ((userSelect = "scissors") && (comSelect = "paper"))) { 
 
      playWins = playWins + 1; 
 
     } else { 
 
      comWins = comWins + 1; 
 
     } 
 
     counter++; 
 
     } 
 

 

 
     //Displaying information in table -- will not work 
 
     document.getElementById("playWins").value = ((playWins).toString()); 
 
     document.getElementById("comWins").value = (comWins).toString(); 
 
     document.getElementById("ties").value = (ties).toString(); 
 
    }

kaynak

2016-03-30 Kyle Habig

div'lerin bir değer alanı yoktur. 'PlayWins', 'comWins' ve 'ties' öğelerinin textContent alanını ayarlamayı deneyin. – xrgb

'document.getElementById (" playWins "). Value = ((playWins) .toString()); ... bu kodu nereden aldınız? –

Yaptım, muhtemelen doğru olmadığını biliyorum. Neden soruyorsun? –

(innerHTML kullanmayın) bkz bir div yazma konusunda daha fazla ayrıntı için

document.getElementById("playWins").textContent

ile deneyin.

kullanabilirsiniz numaraya bir metin dönüştürmek için: sayısal olarak

+document.getElementById("loops").value.trim()

iyi yolu, sadece numaraya metinden dönüşümünü önlemek için, bir giriş kutusu tanımlamak için:

<input type="number" id="loops">

bir çözelti olabilir:

function simulate() { 
 
    var userSelect; 
 
    var comSelect; 
 
    var ties = 0; 
 
    var playWins = 0; 
 
    var comWins = 0; 
 
    var loops; 
 
    var counter = 0; 
 
    loops = +document.getElementById("loops").value.trim(); 
 

 
    while (loops > counter) { 
 
    userSelect = Math.random(); 
 
    if (userSelect < 0.34) { 
 
     userSelect = "rock"; 
 
    } else if (userSelect <= 0.67) { 
 
     userSelect = "paper"; 
 
    } else { 
 
     userSelect = "scissors"; 
 
    } 
 

 
    comSelect = Math.random(); 
 
    if (comSelect < 0.34) { 
 
     comSelect = "rock"; 
 
    } else if (comSelect <= 0.67) { 
 
     comSelect = "paper"; 
 
    } else { 
 
     comSelect = "scissors"; 
 
    } 
 

 
    if (userSelect == comSelect) { 
 
     ties = ties + 1; 
 
    } 
 
    else if (((userSelect = "rock") && (comSelect = "scissors")) || ((userSelect = "paper") && (comSelect = "rock")) || ((userSelect = "scissors") && (comSelect = "paper"))) { 
 
     playWins = playWins + 1; 
 
    } 
 
    else { 
 
     comWins = comWins + 1; 
 
    } 
 
    counter++; 
 
    } 
 
    //Displaying information in table -- will not work 
 
    document.getElementById("playWins").textContent = playWins.toString(); 
 
    document.getElementById("comWins").textContent = comWins.toString(); 
 
    document.getElementById("ties").textContent = ties.toString(); 
 
}

Number of simulations: <input type="textbox" id="loops"><br><br> 
 
<input type="button" value="Play" id="play" onClick="simulate()"><br><br> 
 
<table border="Thick"> 
 
    <tr> 
 
     <td></td> 
 
     <td>Wins</td> 
 
     <td>Percentage</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Player</td> 
 
     <td> 
 
      <div id="playWins" value="test"></div> 
 
     </td> 
 
     <td> 
 
      <div id="playPercent"></div> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>Computer</td> 
 
     <td> 
 
      <div id="comWins"></div> 
 
     <td> 
 
      <div id="comPercent"></div> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>Ties</td> 
 
     <td> 
 
      <div id="ties"></div> 
 
     </td> 
 
     <td> 
 
      <div id="tiesPercent"></div> 
 
     </td> 
 
    </tr> 
 
</table>

kaynak

2016-03-30 17:52:07 gaetanoM

Bu çalışır, ancak programımda denediğimde hiçbir şey görüntülenmez. Ayrıca, rastgele seçimlerde bir mantık hatası tespit ettim. –

@KyleHabig Snippet'imi doğru şekilde kopyaladınız mı? – gaetanoM

Evet, yaptım. Javascript dosyasına doğru bir şekilde işaret etmedim mi? –

. Aşağıdaki

userSelect = Math.random(); 
. 
. 
. 
comSelect = Math.random();

Ayrıca gibi içerik değerini güncellemek değiştirir

düşünün:: Aşağıdaki benim yorum dayanarak bu

loops = document.getElementById("loops").value;

Güncelleme deneyin kullanmak yerine

document.getElementById("playWins").innerHTML = ...;

kaynak

2016-03-30 17:39:58 Milan

Cevabınızı daha fazla bilgi ile düzenleyebilirsiniz, muhtemelen yorum olarak eklemekten daha yararlı olacaktır. – DBS

Teşekkür @DBS. Ben yeni biriyim. :) – Milan

Bunu yerine getirebilirsiniz: document.getElementById ("playWins"). InnerHTML = "Your VALUE";

kaynak

2016-03-30 17:54:24 dutta

Bir div öğesinin içinde bilgi görüntüleme

cevap

İlgili konular