클래스 이름 및 JS 배열을 통해 배경 변경

Question

나는이 작업을 수행 할 것을 시도하고있다 : 현재 클래스 (현재 배열 값)를 제거하고 다음 클래스 (다음 배열 값)를 추가한다.

본질적으로 이것은 이것이 그 것이다.

var myFunction= function (step) { 
     if (lastEntered === step) { 
      triggerEvent(step, "impress:stepleave"); 
      lastEntered = null; 
// Adding in an array of gradients 
var i; 
var bg = new Aray(); 
bg[0] = "gradient-0";  
bg[1] = "gradient-1";  
bg[2] = "gradient-2";    
bg[3] = "gradient-3";  
bg[4] = "gradient-4";  
bg[5] = "gradient-5";     
bg[6] = "gradient-6";  
bg[7] = "gradient-7";  
bg[8] = "gradient-8";     

      for (i=0;i<bg.length;i++) 
      { 
      body.classList.add(bg[i]); 
      } 
     } 
    }; 

어디 body.classList.add ("경사 - 1");을 넣었을 때 나머지 스크립트를 방해하지 않고 한 번 색이 변경되었습니다.

고마워요! 배열이 될 것 정의에 대한 모든 더 나은 연습의 첫 번째

Answer 1

:

var bg = ["gradient-0", "gradient-1", "gradient-0", you get the idea...]; 

정확히 당신이 뭘 하려는지

?
yourFunction이 호출 될 때마다 코드가 9 개의 클래스 이름을 모두 body에 추가합니다.
classList의 remove 메소드를 사용하여 className을 제거 할 수 있습니다.
className 본문에 필요한 단계의 값에 따라 달라 집니까?
은 당신이 뭔가를 할 수 있습니다 :

body.className = bg[step]; 

이 신체의 모든 클래스 이름을 제거하고 그것을 클래스 명에 BG [단계]를 줄 것이다;

또는 몸 BG에있는 것보다 다른 클래스 이름을 가지고 있다면 당신은이 작업을 수행 할 수 있습니다 : 함수가 어떻게해야 무엇

var i = 0, len = bg.length; 
for (; i<len; i++) { 
    if (i === step) { body.classList.add(bg[i]); 
    } else { 
    if (body.classList.contains(bg[i]) { body.classList.remove(bg[i]); } 
    } 
} 

는 다행스럽게도 필자는 도움이되었다하지만 난 어떤 단계 정말 모르겠어요 및 ;}