我正在做一個非常簡單的練習，使用 div 創建帶有按鈕的卡片作為顯示或隱藏答案的開關。我想重新使用第一張卡片的代碼來制作我想要的所有具有相同行為的 div。這是腳本和練習的鏈接，因此更容易看到：<div class="container"><div class="card">  <div><img src="https://i.imgur.com/Sv1a28N.png" alt="manzana" /></div>  <div class="card-title">Apple</div>  <button class="card-button">Show</button>  <div class="card-answer">Manzana</div></div>和腳本var cards = document.getElementsByClassName('card');  for (var cardIndex in cards) {    var button = cards[cardIndex].querySelector('.card-button');      button.addEventListener('click', function(event){        var currentButton = event.target;        var currentCard = currentButton.parentNode;        var currentAnswer = currentCard.querySelector('.card-answer');            if (currentButton.innerHTML == 'Show') {            currentAnswer.style.display = "block";            currentButton.innerHTML = 'Hide';        } else if (currentButton.innerHTML == 'Hide')        {            currentAnswer.style.display = 'None';            currentButton.innerHTML = 'Show';        }    })  }如果您想查看完整代碼，這里還有 codepen 鏈接：Codepen問題是，當我單擊其中一張卡片中的按鈕時，其他卡片的尺寸也會擴大，就像它們也在顯示答案一樣。該按鈕只影響他的直接 div 父母，但似乎同時影響其他卡片的 div 存在一些問題。我認為這不是 JS 或 HTML 問題，而是 CSS 問題，因為容器具有“flex”屬性，而其他容器將其高度調整為第一個。事實上，我嘗試調整屏幕大小，它只影響第一行卡片，而不是第二行。我不知道如何解決這個問題，而不必創建一個類來影響被點擊的卡片并保持其他卡片目前未被點擊。我仍然只是一只蝌蚪，但我想保持代碼盡可能簡單和干凈，并且只保留 Javascript（我想有辦法用 Jquery 解決這個問題，但因為這只是一個 JS 練習，我想解決它接著就，隨即）。這是我在這里的第一篇文章，所以請隨時添加建議以改進或修復我的問題中的任何內容。謝謝！