用前导零填充数字

Question

I am not able to link functions to pad a 4 number with leading zeros. need help here.

<h2 id = 'fourDGenerator'>0000</h2>
<button id = 'ButtonReset' onclick="clickToReset()">RESET</button>     
<button id = 'Button4D' onclick="clickToGenerate()">GENERATE 4D NUMBER</button>   
<script src="script.js"></script>

const Button4D = document.getElementById('fourDGenerator')

let randomNumber = getRandomNumber();
function clickToGenerate (){Button4D.innerText = randomNumber}
function getRandomNumber(){eturn Math.floor(Math.random()*10000);}

let padTo4Numbers = getRandomNumber 
function padTo4Numbers() {('0000'+ getRandomNumber).slice(-4);}

function clickToReset () {location.reload()}```
     
  

Answer 1

You need to get the functions to returns some value after changing some value.

For padding a number, you could take a string method to change the value and omit slicing later.

 function clickToGenerate() { button4D.innerText = padTo4Numbers(getRandomNumber()); } function getRandomNumber() { return Math.floor(Math.random() * 10000); } function padTo4Numbers(value) { return value.toString().padStart(4, 0); } function clickToReset() { button4D.innerText = '____'; } const button4D = document.getElementById('fourDGenerator');

 <h2 id="fourDGenerator">____</h2> <button id="ButtonReset" onclick="clickToReset()">RESET</button> <button id="Button4D"' onclick="clickToGenerate()">GENERATE 4D NUMBER</button>

Answer 2

This is a semplified demo with some errors solved from your code:

 function getRandomNumber(){ return Math.floor(Math.random()*10000); } function padTo4Numbers(n){ return ('0000'+ n).slice(-4); } function generate(){ const randomNumber = getRandomNumber(); const padded = padTo4Numbers(randomNumber); document.querySelector('#target').innerText = padded; }

 #container{ width: 10rem; } #target{ border: solid 2px gray; height: 3rem; font-size: 3rem; text-align: center; } button{ cursor: pointer; }

 <div id="container"> <div id="target"></div> <button onclick="generate();">Generate Random Number</button> </div>

Answer 3

You seem to have implemented the solution from How can I pad a value with leading zeros? :

let n = 1
var padded = ('0000'+n).slice(-4);
console.log(padded)

What about fixing towards a minimal reproducible example:

 function getRandomNumber() { return Math.floor(Math.random()* 10000); // will it ever become less than 4 digits? } function padTo4Digits(n) { // renamed and parameterised return ('0000'+n).slice(-4); // add return } // use both let n = getRandomNumber(); console.log('random', n); console.log('padded', padTo4Digits(n)); // real test console.log('padded test', padTo4Digits(23));