在玩家排名表中存储游戏中的本地存储空间

时间:2017-12-11 17:26:30

标签: javascript html local-storage

我创建了一个游戏,用户在其中玩游戏并将分数保存在本地存储中,但我不确定如何在我的排名页面上的表格中显示用户的分数

玩家排名页

<?php
include ('common.php');

//Output Title & Navigation
outputHeader("Bugshot | Player Ranking");  
generateNav('Player Ranking');
?>
<html>
  <head>
    <script src="user.js"></script>
  </head>    
    <body>
        <div id="pr-heading">
            <h3 div class="subtitle">Earn yourself a spot on the Bug Shot 
    leaderboard</h3>
        </div>
        <div id="pr-subtitle">
            <h3>Player Ranking leaderboard</h3>
        </div>

        <!--Player rankings table-->
            <div id="prTable"></div>

        <!-- Competition banner -->
            <div id="Competition">
                <h3 div class="subtitle">Enter the Bugshot raffle to win ` 
        `$5,000 !</h3>
                    <h3 div class="button">Enter</h3>
            </div>   

        <!--Other Games banner-->    
            <div id="othergames">
                <h3 div class="subtitle">View other games similar to 
        Bugshot</h3>
                <ul>
                    <li><img src="imgs/controller.jpg"></li>
                    <li><img src="imgs/helicopter.jpg"></li>
                    <li><img src="imgs/tetris.jpg"></li>
                </ul>
            </div>     
      </body>        
</html>
<?php
    generateFooter();
?>

JavaScript中的本地存储

function updateScore(score){
var usrObj = JSON.parse(localStorage[localStorage.loggedInUser]);

usrObj.score = score;

localStorage[localStorage.loggedInUser] = JSON.stringify(usrObj);}

一旦用户玩了

,变量得分就会从游戏中传出

帮助表示赞赏

1 个答案:

答案 0 :(得分:0)

看起来你想要使用localStorage内容动态生成html。您可以手动编写javascript或使用现有的库/工具(例如,jQuery,React)将新元素注入页面。