0

誰も助けてくれますか?私はテーブルに連想配列を表示する方法は?

  1. 目標に「幸運のゲーム」のために、彼らが望む任意の数のテイクユーザー入力をスクリプトを書いて、0から彼らは結果配列でそれを入力し、表示する数に乱数を生成しています。

  2. 「はヘッドや尾」の試合をシミュレートしても同じ結果アレイ(Iは、連想配列を使用する)

  3. 実行6回の合計上記二つの目的でその結果を表示します。

  4. 結果を表に表示します。

  5. 「頭」の総量と「尾」の合計量を合計して表示します。

  6. 6つの結果の中で最小の数値を返します。

私はすでに完了した項目1、2、および3私はちょうど同様に2×7の「コインサイド」の見出しを持つテーブルと「数」に私の結果を表示する方法項目6に助けが必要どのように6つの試行のすべての "頭"と "尾"を集計すると同時に、生成された最小の数字を返しますか?

<body> 
<div id = "luckGame"></div> 

var userInput = prompt("Enter maximum number output: "); 
printThis = document.getElementById('luckGame'); 

function coinFlip() { 
     return (Math.floor(Math.random() < 2) === 0) ? 'Heads' ; 'Tails'; 
} 

for (var i = 0; i < 6; i++) 
{ 
     var result = []; 

     result["randomNum"] = (Math.floor(Math.random()*userInput); 

     result["coin"] = (coinFlip()); 

    printThis.innerHTML = result["coin"] + " " + result["randomNum"]; 
    //This loop will run 6 times. 
    //This should print for example: Heads 29 but I need to put all the results 
    //in a 2x7 table with labels "Coin Side" and "Number" included. How do I do this? 
} 

//Code here needed to sum total of 'Heads' and 'Tails' 
//Code here needed to return the smallest number from the results. 

</body> 

テーブル

.results { 
     border: 1px solid black; 
     width: 200px; 
     height: 20px; 
    } 

マイラフテーブル

var resultsTable = "<table class= 'results'><tr><td>" + "Coin Side" + "</td><td>" + "Number" + "</td></tr>"; 
    resultsTable += "<tr><td> + result["coin"] + "</td><td> + result["randomNum"] + </td></tr>"; 
    ... // repeat 4 more times. 
    resultsTable += "<tr><td> + result["coin"] + "</td><td> + result["randomNum"] + </td></tr></table>; 

私が私に教えてください詳細を配置する必要がある場合のための私のCSS。

+0

ループが6回を実行するまで、ループが繰り返されたときに、私は(私は「過剰足す」ことなく、1つのアレイにそれぞれの結果をプッシュすることができますどのように、6つの別の結果のために考えています私はそれまでに6つの別々の結果値を持つべきです)。 – 5120bee

+0

開始テーブルhtml ...ループデータ追加行...終了テーブルhtmlと挿入 – charlietfl

+0

多分ループ内の行を追加するコードを行う方法を私に示すことができたらもっと助けてください... – 5120bee

答えて

1

まず、次に、あなたのループに単にテーブル

var row = document.createElement("tr"); 
var coinCell = document.createElement("td"); 
var numCell = document.createElement("td"); 
coinCell.innerHTML = result["coin"]; 
numCell.innerHTML = result["randomNum"]; 
row.appendChild(coinCell); 
row.appendChild(numCell); 
table.appendChild(row); 

に行を追加するために最後にこのコードを追加し、最終的にテーブルを追加し、ヘッダー

var table = document.createElement("table"); 
table.innerHTML = "<tr><th>Coin Side</th><th>Number</th></tr>"; 

でテーブルを作成します文書

document.body.appendChild(table); 

このコードを既存のループに追加してください

(result["coin"] === "Heads") ? heads++ : tails++ 

ただ、最初

var min = eval(userInput); 

そして、最大値に設定されたグローバル変数を作成し、2つのグローバル変数を作成し、最小値を取得するためのゼロ最初

var heads = 0; 
var tails = 0; 

にそれらを設定し、ループ内で、生成された数値が現在の数値より小さいかどうかを確認します。min

if(result["randomNum"] < min) 
    min = result["randomNum"]; 

デモhttps://codecanister.com/Project/d547eed9/5/result/

+0

ありがとう、これはそうですループ内のテーブルに行を追加するのに便利です。 – 5120bee

+0

この回答が役に立ちましたら、それを受け入れるようにしてください:http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work – jlynch630

+0

もう1つのこと - 私はすでに'Heads'と 'Tails'の合計を集計するためのコードですが、ループは「Heads」と「Tails」という単語を別々の文字のように読み込んでいますので、+1だけインクリメントするのではなく、それぞれ+5ずつインクリメントします私のループが走る時間:[link](https://jsfiddle.net/jkvkt4x2/) – 5120bee