使用innerText访问对象名称

时间:2017-07-30 19:44:27

标签: javascript html

JS新秀在这里。我想访问具有最高组合能力+得分的玩家名称,并在点击按钮时显示它,我想我已经关闭但无法弄清楚最后一步。

我可以通过调用' endScore'来恢复该功能。但不知道如何检索结果'这应该是得分最高的球员。

我该怎么做呢?



var onButtonClick = function() {
  console.log('test');

//define player objects, setting ability//
  
var playerList = [
    {name: "player1", highScore: 1, ability: 8},
    {name: "player2", highScore: 1, ability: 7},
    {name: "player3", highScore: 1, ability: 6},
    {name: "player4", highScore: 1, ability: 5},
    {name: "player5", highScore: 1, ability: 4},
    {name: "player6", highScore: 1, ability: 3},
    {name: "player7", highScore: 1, ability: 2},
    {name: "player8", highScore: 1, ability: 1}
    ];

//calculate progress/score for each player at the tournament and adds to their 'ability', updating the objects above//
  
    for (var i = 0; i < playerList.length; i++) {
        var progress=Math.random();
        progress=11*progress;
        progress=Math.floor(progress);
        playerList[i].ability=playerList[i].ability+progress;
        console.log(playerList[i])
        }

//calculate which player had the highest score/progress//
  
    function endScore() {
        var score = 0;
        var result = [];
        for (var i = 0; i < playerList.length; i++) {
            if(playerList[i].ability > score) {
                result = playerList[i];
                score = playerList[i].ability;
            }
        }
        return result;
  }
            
// set "winner" variable equal to the DOM element//
const winner = document.getElementById("winner1")

// Set the winner's innerText equal to the contents of the 'result' variable//
winner.innerText = result.endScore();
                         }

document.getElementById("tourn1").addEventListener("click", onButtonClick)
&#13;
<ul>
	<li>Player 1</li>
	<li>Player 2</li>
	<li>Player 3</li>
	<li>Player 4</li>
	<li>Player 5</li>
	<li>Player 6</li>
	<li>Player 7</li>
	<li>Player 8</li>
</ul>

<button id="tourn1">Play tournament 1</button>

<p id="winner1">The winner is...</p>
&#13;
&#13;
&#13;

提前致谢。

1 个答案:

答案 0 :(得分:2)

关闭。将endScore()调用定义为变量,然后将.innerHTML设置为result.nameresult.highScore

&#13;
&#13;
var onButtonClick = function() {
  console.log('test');

  //define player objects, setting ability//

  var playerList = [{
      name: "player1",
      highScore: 1,
      ability: 8
    },
    {
      name: "player2",
      highScore: 1,
      ability: 7
    },
    {
      name: "player3",
      highScore: 1,
      ability: 6
    },
    {
      name: "player4",
      highScore: 1,
      ability: 5
    },
    {
      name: "player5",
      highScore: 1,
      ability: 4
    },
    {
      name: "player6",
      highScore: 1,
      ability: 3
    },
    {
      name: "player7",
      highScore: 1,
      ability: 2
    },
    {
      name: "player8",
      highScore: 1,
      ability: 1
    }
  ];

  //calculate progress/score for each player at the tournament and adds to their 'ability', updating the objects above//

  for (var i = 0; i < playerList.length; i++) {
    var progress = Math.random();
    progress = 11 * progress;
    progress = Math.floor(progress);
    playerList[i].ability = playerList[i].ability + progress;
    console.log(playerList[i])
  }

  //calculate which player had the highest score/progress//

  function endScore() {
    var score = 0;
    var result = [];
    for (var i = 0; i < playerList.length; i++) {
      if (playerList[i].ability > score) {
        result = playerList[i];
        score = playerList[i].ability;
      }
    }
    return result;
  }

  // set "winner" variable equal to the DOM element//
  const winner = document.getElementById("winner1")

  // Set the winner's innerText equal to the contents of the 'result' variable//
  var result = endScore();
  winner.innerText = "name: "
                     + result.name 
                     + " high score: " + result.highScore
                     + " ability: " + result.ability;
}

document.getElementById("tourn1").addEventListener("click", onButtonClick)
&#13;
<ul>
  <li>Player 1</li>
  <li>Player 2</li>
  <li>Player 3</li>
  <li>Player 4</li>
  <li>Player 5</li>
  <li>Player 6</li>
  <li>Player 7</li>
  <li>Player 8</li>
</ul>

<button id="tourn1">Play tournament 1</button>

<p id="winner1">The winner is...</p>
&#13;
&#13;
&#13;