![](/img/trans.png)
[英]How to take the values inside a div element , remove the <br> and turn the values into array with JavaScript ,no Jquery please
[英]How to turn the elements in a div into an array with js/jQuery
我正在尝试将按钮列表及其名称放入 javascript 中的数组中? 我在 inte.net 上搜索了帮助,但到目前为止还没有找到任何东西。 名称为“apps”的 div 是我试图从中获取的位置,javascript 代码中 if 语句内的数组是我要用数组替换的内容。
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 代码:
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)
如果您仍然不明白我在做什么,这里有另一种解释:我希望代码为 go 来自
<div>
<button>Obj1</button>
<button>Obj2</button>
</div>
到
["Obj1","Obj2"]
哦,还有一个问题,如果你也能回答,我如何在我用 js 创建的项目之间添加断线?
对于您的简化示例:
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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.