在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ js去除class方法。

js去除class方法。

請(qǐng)問(wèn)怎么用js的方法去除10個(gè)div里的class名啊。
按照我這么寫(xiě)沒(méi)用。我把settimeout放在（function(）{})（i））里面也沒(méi)有用。新人不懂。。求指點(diǎn)。我想做蘋(píng)果主頁(yè)那個(gè)按放大鏡背后一列消失的效果。
<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<title>Document</title>

</head>
<style type="text/css">

  div{
      width: 100px;
      height: 100px;
      display: inline-block;
      background: #eaf444
  }
  .a{
      box-sizing: border-box;
  }
  .border{
      border: 1px solid black
  }

</style>
<body>

<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<button id="btn">btn</button>

<script type="text/javascript">

  var btn = document.getElementById('btn');
  btn.onclick = function(){
       var a = document.getElementsByClassName('a');
       for(var i = 0 ; i < a.length;i++){
           a[i].setAttribute('class','a border');
           setTimeout(function(){
               a[i].setAttribute('class','a')
           },2000)
       }
  }

</script>
</body>
</html>

回答
編輯回答
清夢(mèng)

(function (j) {

            a[j].setAttribute('class','a border');
            setTimeout(function(){
                a[j].setAttribute('class','a')
            },2000)
        })(i)
2017年6月9日 10:54
編輯回答
任她鬧

作用域的問(wèn)題，for循環(huán)里面的i作用域在for循環(huán)外面，循環(huán)結(jié)束的時(shí)候i變成了a.length(就是10)，所以實(shí)際上你是運(yùn)行了10次

setTimeout(function(){
    a[10].setAttribute('class','a')
},2000)

解決方案前面都給了，加個(gè)閉包就好。

(function(i){
   setTimeout(function(){
       a[i].setAttribute('class','a')
   },2000)
})(i)

這個(gè)時(shí)候function里i的作用域就會(huì)被限制在function里，每次循環(huán)都是一個(gè)新的變量i，不會(huì)被for循環(huán)改變。

2017年3月11日 20:15
編輯回答
醉淸風(fēng)

作用域問(wèn)閉包問(wèn)題

(function(i){
   setTimeout(function(){
       a[i].setAttribute('class','a')
   },2000)
})(i)
2018年5月7日 14:09
編輯回答
臭榴蓮

經(jīng)典的閉包問(wèn)題...

  var btn = document.getElementById('btn');
  btn.onclick = function(){
       var a = document.getElementsByClassName('a');
       for(var i = 0 ; i < a.length;i++){
           a[i].setAttribute('class','a border');
           (function fn(i) {
               setTimeout(function(){
                   a[i].setAttribute('class','a')
               },2000)
           })(i)
       }
  }
2017年1月29日 23:13
編輯回答
夏夕
(function(i){
     setTimeout(function(){
         a[i].setAttribute('class','a')
     },2000)
})(i)
2018年7月31日 05:52
編輯回答
夕顏
**直接拷貝我的過(guò)去**

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<title>Document</title>
</head>
<style type="text/css">

div{

  width: 100px;
  height: 100px;
  display: inline-block;
  background: #eaf444

}
.a{

  box-sizing: border-box;

}
.border{

  border: 1px solid black

}
</style>
<body>

<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>
<button id="btn">btn</button>
<script type="text/javascript">

var btn = document.getElementById('btn');
btn.onclick = function(){

   var a = document.getElementsByClassName('a');
   for(var i = 0 ; i < a.length;i++){
       a[i].setAttribute('class','a border');
       (function(i){
           setTimeout(function(){
               a[i].setAttribute('class','a')
           },2000)
        })(i)
   }

}
</script>
</body>
</html>

2018年8月26日 15:34
編輯回答
尐潴豬
setTimeout(function(i){
       a[i].setAttribute('class','a')
   },2000,i)
2017年8月8日 19:48