已解決430363個問題，去搜搜看，總會有你想問的

如何遍歷列表并應用 jQuery 來更改類

首頁猿問如何遍歷列表并應用 jQuery...

如何遍歷列表并應用 jQuery 來更改類

JavaScript

慕絲7291255 2022-10-08 15:45:11

我正在學習 JavaScript。在下面的例子中，我試圖循環列表項以獲取其原始類更改。（具有紅色類的列表項將變為綠色類，反之亦然）我也想不斷地改變它以獲得動畫效果。如何將javascript和jQuery一起添加？我需要為每個列表項設置超時嗎？*<style>* .red{ color:red; } .green{ color:green; }*</style>* *<body>*<ul class="list-inline-mb-0 "> <li class="list-inline-item header red">C </li> <li class="list-inline-item header green">O</li> <li class="list-inline-item header red">O</li> <li class="list-inline-item header green">L</li> </ul>*</body>**<script>* $(function()) { var myListElem = document.getElementsByClassName('li'); $('li').each(function() { if(myListElem).hasClass("red"){ $(myListElem).addClass('green'); } else{ $(myListElem).addClass('red') } }); *</script>*

查看完整描述

1 回答

狐的傳說

TA貢獻1804條經驗獲得超3個贊

首先，li不是一個類——list-inline-item是。其次，您不是在嘗試遍歷數組$('li').each(function()...，因為$('li')這不是您獲取元素的方式。第三，即使修復循環并添加重復 ( setInterval()) 也不會給您動畫，因為您只是添加類而不是刪除它們。在您的示例中，當您檢查red您時，然后添加green并獲得red green結果類?？偨Y所有所說的事情，這樣的事情會做：

$(function() {

var myListElem = document.getElementsByClassName('list-inline-item');

setInterval(function(){

for(let i = 0; i < myListElem.length; i++){

let e = myListElem[i];

if($(e).hasClass("red")){

$(e).addClass('green');

$(e).removeClass('red');

}

else{

$(e).removeClass('green');

$(e).addClass('red');

}

}, 3000);

});

.red{

color:red;

}

.green{

color:green;

}

</ul>

反對回復 2022-10-08

1 回答
0 關注
183 瀏覽

關注

添加回答

舉報

0/150

提交

取消

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

熱搜

最近搜索清空

如何遍歷列表并應用 jQuery 來更改類

如何遍歷列表并應用 jQuery 來更改類

1 回答

添加回答