亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何清除 div 中的值(TICTACTOE GAME)

如何清除 div 中的值(TICTACTOE GAME)

胡說叔叔 2022-10-21 14:39:29
我需要幫助來清除我的井字游戲的 div 值。這是我擁有的 HTML 代碼:<div class="btns">            <button class="btnstart" id="start">Start game</button><button class="btnrefresh" id="refresh">Refresh</button>        </div>        <div class="play-area gray pointerEvents">            <div id="block_0" class="block"></div>            <div id="block_1" class="block"></div>            <div id="block_2" class="block"></div>            <div id="block_3" class="block"></div>            <div id="block_4" class="block"></div>            <div id="block_5" class="block"></div>            <div id="block_6" class="block"></div>            <div id="block_7" class="block"></div>            <div id="block_8" class="block"></div>          </div>這是我將 X 和 O 放在 div 上的代碼:boxes.addEventListener('click', e =>{                //dispalay x and o.        move++;                if (turn % 2 === 1){                    event.target.innerHTML = activePlayer1;                    turn++;                }else{                    event.target.innerHTML = activePlayer2;                    turn--;                }    })現在我想使用以下代碼清除 div 類塊中的值:refreshbtn.addEventListener('click', e =>{             document.querySelector('.block').innerHTML = '';    })但這似乎不起作用。:(
查看完整描述

2 回答

?
HUH函數

TA貢獻1836條經驗 獲得超4個贊

你需要querySelectorAll而不是querySelector. 由于您要更改多個元素。然后使用循環更改每個項目


const refreshbtn = document.querySelector("button");

const blocks = document.querySelectorAll(".block");


refreshbtn.addEventListener('click', e => {

  blocks.forEach(block => {

    block.innerHTML = "";

  });

})

<div class="block">A</div>

<div class="block">B</div>

<div class="block">C</div>

<div class="block">D</div>

<div class="block">E</div>


<button>Refresh</button>


查看完整回答
反對 回復 2022-10-21
?
侃侃爾雅

TA貢獻1801條經驗 獲得超16個贊

document.querySelector('.block')只返回類塊的第一個元素,所以很明顯只有id 為 block_0的 div



查看完整回答
反對 回復 2022-10-21
  • 2 回答
  • 0 關注
  • 122 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號