怎么做到这个？

Question

我正在做一个小游戏，遇到一些问题，我希望你能帮助我。我在这篇文章中有4个问题。

1. 如何将JS函数更新为html
2. 如何省钱，xp和水平？
3. 如何制作最高级别的练级系统
4. 如何在函数
中创建随机数

JS代码：

var money = 0;
var xp = 0;
var level = 0;

function startClick(number){
    money = money + 50; //Want it to be random number to get
    xp = xp + 100; //Same here
}

Answer 1

你的问题非常多，但我很无聊

这是制作简单闲置游戏Guide的好指南，您可以从指南中学到的知识来制作自己的小游戏。

1. 如何将JS更新为html

Demo

您将在函数

中使用document.getElementById("thekey").innerHTML = thekey;

var money = 0;
var xp = 0;
var level = 0;

function startClick(number){
    money = parseInt(money) + 50; //Want it to be random number to get
    xp = xp + 100;//Same here
    //This will update money,xp to your html
    document.getElementById("money").innerHTML = money; 
    document.getElementById("xp").innerHTML = xp;
}

1. 如何保存数据

Demo

Good guide about localStorage

保存您的数据。 money，xp和levels，你将使用localStorage。

var money = 0;
var xp = 0;
var level = 0;

//This loads the data
if(localStorage.money) money = localStorage.getItem('money');
//This updates the data when you load the html
document.getElementById("money").innerHTML = money;

if(localStorage.xp) xp = localStorage.getItem('xp');
document.getElementById("xp").innerHTML = xp;

function startClick(number){
    money = parseInt(money) + 50; //Want it to be random number to get
    xp = parseInt(xp) + 100;//Same here
    //This will update money,xp to your html
    document.getElementById("money").innerHTML = money;
    //This sets the data, so "getItem" can load it
    localStorage.setItem('money', money);
    document.getElementById("xp").innerHTML = xp;
    localStorage.setItem('xp', xp);

}

1. 如何制作最高级别的练级系统

Demo

要制作一个具有最高级别的简单校平系统，您将使用if..else和1函数。

var money = 0;
var xp = 0;
var level = 0;

//This loads the data
if(localStorage.money) money = localStorage.getItem('money');
//This updates the data when you load the html
document.getElementById("money").innerHTML = money;

if(localStorage.xp) xp = localStorage.getItem('xp');
document.getElementById("xp").innerHTML = xp;

if(localStorage.level) level = localStorage.getItem('level');
document.getElementById("level").innerHTML = level;

//This will set the max level, you can change the max by change 30 to what you want.
if(level > 30){
    level = 30;
    document.getElementById("level").innerHTML = level;
}

//This is your leveling system, its combine to the button with startClick.
function levelClick(number){
if(xp >= 500){
    level = parseInt(level) + 1;
    document.getElementById("level").innerHTML = level;
    xp = parseInt(xp) - 500;
    document.getElementById("xp").innerHTML = xp;
    localStorage.setItem('level', level);
    }
}

function startClick(number){
    money = parseInt(money) + 50; //Want it to be random number to get
    xp = parseInt(xp) + 100;//Same here
    //This will update money,xp to your html
    document.getElementById("money").innerHTML = money;
    //This sets the data, so "getItem" can load it
    localStorage.setItem('money', money);
    document.getElementById("xp").innerHTML = xp;
    localStorage.setItem('xp', xp);

}

1. 如何生成随机数

Demo

要在startClick中生成随机数，您将使用Math.random
  比如var random = Math.floor(Math.random() * (Max - min + min)) + 1;将其添加到您的函数中并使用var random之类的money = parseInt(money) + random;，它会每次生成一个随机数。

var money = 0;
var xp = 0;
var level = 0;

//This loads the data
if(localStorage.money) money = localStorage.getItem('money');
//This updates the data when you load the html
document.getElementById("money").innerHTML = money;

if(localStorage.xp) xp = localStorage.getItem('xp');
document.getElementById("xp").innerHTML = xp;

if(localStorage.level) level = localStorage.getItem('level');
document.getElementById("level").innerHTML = level;

//This will set the max level, you can change the max by change 30 to what you want.
if(level > 30){
    level = 30;
    document.getElementById("level").innerHTML = level;
}

//This is your leveling system, its combine to the button with startClick.
function levelClick(number){
if(xp >= 500){
    level = parseInt(level) + 1;
    document.getElementById("level").innerHTML = level;
    xp = parseInt(xp) - 500;
    document.getElementById("xp").innerHTML = xp;
    localStorage.setItem('level', level);
    }
}

function startClick(number){
    //This generate a random number, every time you click the button
    var moneyrandom = Math.floor(Math.random() * (300 - 100 + 100)) + 1;
    var xprandom = Math.floor(Math.random() * (500 - 100 + 100)) + 1;
    money = parseInt(money) + moneyrandom; 
    xp = parseInt(xp) + xprandom;
    //This will update money,xp to your html
    document.getElementById("money").innerHTML = money;
    //This sets the data, so "getItem" can load it
    localStorage.setItem('money', money);
    document.getElementById("xp").innerHTML = xp;
    localStorage.setItem('xp', xp);

}