初学者：从 Javascript 数组中删除项目
[英]BEGINNER: Removing items from Javascript Array
问题描述
I am coding a random quote generator.
我正在编写一个随机报价生成器。 I almost have it fully coded how I want.我几乎已经完全按照我想要的方式进行了编码。 I am a beginner in HTML and I've never used Javascript before this weekend.我是 HTML 的初学者，在本周末之前我从未使用过 Javascript。 I took from multiple tutorials to code this exactly how I want it and am very proud.我从多个教程中获取了我想要的代码，并且非常自豪。 I have one last thing I am trying to do.我还有最后一件事要做。 When a item from the array is called, I want it to be removed, stored in another array and when the original array reaches 0, I want it to reset.当调用数组中的一个项目时，我希望将其删除，存储在另一个数组中，当原始数组达到 0 时，我希望它重置。 I know its possible but I am not sure what to add to this script to make it work.我知道这是可能的，但我不确定要添加到这个脚本中以使其工作。 Thanks so much for any help.非常感谢您的帮助。
const quotes = [{ game: 'CARD TYPE 1', quote: "This is the card description for Card Type 1", rule: "Card Type 1 Rules" }, { game: 'CARD TYPE 2', quote: "This is the card description for Card Type 2", rule: "Card Type 2 Rules" }, { game: 'CARD TYPE 3', quote: "This is the card description for Card Type 3", rule: "Card Type 3 Rules" } ]; const maincontainer = document.querySelector("#quoteBtn"); const questionStyle = document.querySelector("#quote"); const gameTitleStyle = document.querySelector("#gameTitle"); const ruleStyle = document.querySelector("#ruleTxt"); quoteBtn.addEventListener("click", displayQuote); function displayQuote() { let number = Math.floor(Math.random() * quotes.length); gameTitle.innerHTML = quotes[number].game; quote.innerHTML = quotes[number].quote; ruleTxt.innerHTML = quotes[number].rule; }
<style type="text/css"> body { font-family: "Poppins", sans-serif; background-color: #3F6BFF; }.maincontainer { position: relative; width: 500px; height: 300px; animation: flip 1s; text-align: center; margin: 0 auto; border-radius: 25px; }.thecard { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: all 0.5s ease; border-radius: 25px; }.thecard:active { transform: rotateY(360deg); }.thefront { position: absolute; width: 100%; height: 100%; padding-right: 30px; padding-left: 30px; backface-visibility: hidden; background-color: #fff; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 25px; }.theback { position: absolute; width: 100%; height: 100%; padding-right: 30px; padding-left: 30px; backface-visibility: hidden; transform: rotateY(180deg); background: #000; border-radius: 25px; }.gameTitleStyle { font-weight: 800; font-size: 32px; text-transform: uppercase; }.ruleStyle { position: relative; top: -20px; font-style: italic; }.questionStyle { position: relative; top: 20px; font-size: 18px; } </style> <body> <div class="maincontainer" id="quoteBtn"> <div class="thecard"> <div class="thefront"> <h1 class="gameTitleStyle" id="gameTitle">Business Name</h1> <p class="ruleStyle" id="ruleTxt">Rules</p> <p class="questionStyle" id="quote">Card Description</p> </div> <div class="theback"></div> </div> </div> </body>
1 个解决方案
解决方案1
1 2020-04-26 19:47:51
Removing an element from an array can be done with the Array.prototype.splice() method.可以使用Array.prototype.splice()方法从数组中删除元素。 For example, this removes element 2 from an array called "items", and returns the removed element in a new array:例如，这会从名为“items”的数组中删除元素 2，并在新数组中返回删除的元素：
let removedItems = items.splice(2);
Add items to an array using Array.prototype.push() :使用Array.prototype.push()将项目添加到数组中：
otherArray.push(...removedItems);
The ...removedItems converts the removedItems array to a list of items. ...removedItems将 removedItems 数组转换为项目列表。 The ... is called the spread operator . ...称为扩展运算符。
These should be enough to accomplish what you want.这些应该足以完成您想要的。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.