我在將隨機陣列元素插入 DOM 時遇到了問題。我希望它只對每個陣列元素執行一次，但代碼會無限地獲取元素。
我正在做一個紙牌游戲，并希望代碼能夠理解我正在從牌組中挑選一張牌，所以它應該從陣列中洗掉它。但是當我單擊按鈕時，它會繼續運行并一遍又一遍地重復相同的卡片。按鈕只能隨機抽一張牌。
這是代碼：
<!DOCTYPE html>
<html>
<head>
<title>TEST</title>
<style>
.testDivExe{
border: 0.1em dashed black;
width: 100%;
background-color: rgb(192,192,192,0.6);
}
body{
border: 0.1em dotted black;
font-family: impact;
font-size: 2em;
background-color: rgb(192,192,192,0.4);
}
</style>
</head>
<header>
<h1>ZONE</h1>
</header>
<body>
<div id="testDivExeId">
<button id="testClickId">click</button>
<div>
<footer>
</footer>
<script>
//TEST1
document.getElementById("testClickId").onclick = function testFunc1(){
// RAND AND ARR
var array1 = ["Hello", "There", "Some", "Things", "Never", "Change",];
var deal = function(){
var index = Math.floor(Math.random() * array1.length);
var card = array1[index];
array1.splice(index, 1);
return card;
};
// PER&CRE
var object = document.createElement('p');
object.innerHTML = deal(array1);
//REND
document.getElementById("testDivExeId").appendChild(object);
return false;
};
</script>
</body>
</html>
uj5u.com熱心網友回復：
array1每次單擊按鈕時都會創建。您必須array1以保留其當前值的方式存盤。您可以array1在全域范圍內宣告或將陣列存盤在瀏覽器記憶體中。您實際上應該從陣列中移除卡（我建議您使用filter而不是splice）。最后確保<p>僅在至少存在一張卡時才創建新卡。
<script>
//TEST1
// RAND AND ARR
var array1 = ["Hello", "There", "Some", "Things", "Never", "Change",];
document.getElementById("testClickId").onclick = function testFunc1() {
if (array1.length === 0) // Check if exists any card.
return;
var deal = function () {
var index = Math.floor(Math.random() * array1.length);
var card = array1[index];
array1 = array1.filter(c => c !== card); // Remove the card
return card;
};
// PER&CRE
var object = document.createElement('p');
object.innerHTML = deal(array1);
//REND
document.getElementById("testDivExeId").appendChild(object);
return false;
};
</script>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/472975.html
標籤：javascript 数组 dom 随机的
上一篇：如何從物件中洗掉屬性
下一篇：新網址未在新標簽頁中打開