我正在嘗試通過單擊開始測驗按鈕添加一個類并洗掉另一個類。雖然 'info_box' 類成功添加，但 'start_btn' 類沒有被洗掉，它只是改變了位置（從 flex 到無 flex）。這是 Html
<body>
<div >
<div >
<button type="button" >Start Quiz</button>
</div>
<div >
<div >
<!--Rest of the code-->
這是 CSS
/*START BUTTON BOX*/
.start_btn {
height:80vh;
display: flex;
justify-content:center;
align-items:center;
}
.startBtn{
font-size: 25px;
font-weight: 500;
color: var(--clr-steelBlue);
padding: 15px 30px;
outline: none;
border: none;
border-radius: 5px;
background: var(--clr-white);
cursor: pointer;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2),
0 6px 20px 0 rgba(0, 0, 0, 0.19);
pointer-events: auto;
}
.startBtn:focus{
background-color: var(--clr-steelBlue);
color:var(--clr-white);
outline: var(--clr-steelBlue);
}
.showInfoBox.info_box{
display: flex;
}
/* INFO BOX*/
.info_box {
height:100vh;
display: flex;
justify-content:center;
align-items:center;
display:none;
}
這是javascript
const startbtn = document.querySelector(".start_btn");
const infoBox = document.querySelector(".info_box");
startbtn.addEventListener('click', function(){
startbtn.classList.remove("start_btn");
infoBox.classList.add("showInfoBox");
})
我檢查了開發人員工具，它是這樣的。類 start_btn 不存在，但 start_btn div 內的按鈕仍然存在
我嘗試在洗掉 start_btn 框之前單獨洗掉按鈕，但它不起作用我嘗試創建一個單獨的類來洗掉 start_btn 像這樣但它不起作用
.hide.start_btn{
z-index:-1;
pointer-events: none;
}
我該怎么做才能洗掉 start_btn 類？謝謝你！！
uj5u.com熱心網友回復：
它做它打算做的事情：從元素中洗掉類。如果要從 DOM 中洗掉該元素，請使用remove()方法。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/335884.html