如何用js/jQuery将div中的元素变成数组

Question

I'm trying to make a list of buttons and their names into an array in javascript?我正在尝试将按钮列表及其名称放入 javascript 中的数组中？ I heave searched the inte.net for help but not found anything so far.我在 inte.net 上搜索了帮助，但到目前为止还没有找到任何东西。 The div with the name "apps" is where I'm trying to grab from and the array inside of the if statement in the javascript code is what I'm to to replace with the array.名称为“apps”的 div 是我试图从中获取的位置，javascript 代码中 if 语句内的数组是我要用数组替换的内容。

HTML code: HTML 代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="clicker.css">
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <title>Vairoon's clicker</title>
</head>
<body>
    <button onclick="smnPlayer()">Get new player</button>
    <p>Players per click: <span id="PPC">1</span></p>
    <p>Players: <span id="players">0</span></p>
    <p>New players per second: <span id="PPS">0</span></p>
    <div class="upgrade">
        <p>Upgrade your clicker game: <span id="upgCost">400</span></p>
        <button id="upgrade">Upgrade clicker</button>
    </div>
    <div id="apps" name="apps"> <!-- The div I'm trying to grab from-->
    <button>Obj1</button>
    <button>Obj2</button>
    </div>
    <script ="clicker.js"></script>
</body>
</html>

Javascript code: Javascript 代码：

var players=0;
var PPS=0;
var PPC=1;
var upgradeCost=400;
var apps = ["New buildings","More upgrades","Adverts","More minigames"]
var basecosts = [0,20,100,1500,15000]
function getEl(elID) {
    return document.getElementById(elID);
}
function smnPlayer() {
    players+=PPC;
    document.getElementById("players").innerHTML=players;
}
getEl("upgrade").onclick = function upgrade() {
    if (players>=upgradeCost) {
        players-=upgradeCost;
        upgradeCost=upgradeCost*3;
        PPC=Math.ceil(PPC*2);
        PPS=PPS*2;
        getEl("players").innerHTML=players;
        getEl("upgCost").innerHTML=upgradeCost;
        getEl("PPC").innerHTML=PPC;
        getEl("PPS").innerHTML=PPS;
    }
}
setInterval(() => {
    if (players>=upgradeCost) {
        getEl("upgrade").style.display="block";
    } else {
        getEl("upgrade").style.display="none";
    }
    for (let index = document.querySelectorAll('#apps').length; index < basecosts.length+1; index++) {
        if (players>=basecosts[index]) {
            if (array.includes(apps[index])){}else{ //the "array" is what to replace with the array
                var button = document.createElement("BUTTON");
                button.innerHTML = apps[index];
                document.getElementById("apps").appendChild(button);
            }
        }
    }
    
},10)

If you still don't understand what I'm trying to do, here's another explanation: I want the code to go from如果您仍然不明白我在做什么，这里有另一种解释：我希望代码为 go 来自

<div>
 <button>Obj1</button>
 <button>Obj2</button>
</div>

to到

["Obj1","Obj2"]

Oh and a question if you can answer too, how do I add break line between the items I'm creating just with js?哦，还有一个问题，如果你也能回答，我如何在我用 js 创建的项目之间添加断线？

Answer 1

For your simplified example:对于您的简化示例：

 myArray = Array.from(document.querySelectorAll("div button")).map( function(b) { return b.innerText; } ); console.log(myArray); //add a line break: document.querySelector("div").insertBefore(document.createElement("br"),document.querySelectorAll("div button")[1]);

 <div> <button>Obj1</button> <button>Obj2</button> </div>

如何用js/jQuery将div中的元素变成数组

问题描述

1 个解决方案

解决方案1
0 已采纳 2022-04-19 17:32:17

如何用js/jQuery将div中的元素变成数组

问题描述

1 个解决方案

解决方案1 0 已采纳 2022-04-19 17:32:17

解决方案1
0 已采纳 2022-04-19 17:32:17