하기에> 내 #container의 사업부 여기</p> <p>내 요소는 내 코드 < 리

Question

내가 임의의 클래스를 추가하려고 경우에도 지정된 나는 10 < 리> 요소가 나는 임의의 방식으로 세 가지 클래스 중 하나를받을 수 이러한 각 요소를 원한다.

위의 코드는 나머지 세 개의 클래스가없는 클래스로 세 개의 < li> 요소 만 할당합니다. 클래스는 less 클래스입니다.

나는 무작위로 지정된 모든 요소에 클래스 목록을 적용있는 다른 코드의 조각하지만 전혀 노력했다.

이 게시물 HERE에서 조각을 시도했지만 아무도 모든 요소가 임의의 클래스를 얻을 확인하고 원하는 결과를 생성하지 않습니다.

도움 주셔서 감사합니다.

당신은 클래스의 배열을 사용하여 다음과 같은 선택 일치하는 각 요소에 해당 배열에서 임의의 클래스를 할당 할 수

Answer 1

: 각 클래스는 한 번만 사용되도록하려면

$(document).ready(function(){ 
    var classes = ["one", "two", "three"]; 

    $("#container li").each(function(){ 
     $(this).addClass(classes[~~(Math.random()*classes.length)]); 
    }); 
}); 

을, 당신 이 사용될 때 배열에서 제거 할 수 있습니다 :이 같은

$(document).ready(function(){ 
    var classes = ["one", "two", "three"]; 

    $("#container li").each(function(){ 
     $(this).addClass(classes.splice(~~(Math.random()*classes.length), 1)[0]); 
    }); 
}); 

Answer 2

뭔가 작업 할 수 있습니다

$(function(){ 
    $("#container li").each(function(){ 
     var rng = Math.round(Math.random()*4); 
     var rndmClass = [ 'one', 'two', 'three', 'four', 'five' ]; 

     $(this).addClass(rndmClass[rng]); 
    }); 
}); 

ul#container 
    li 
    li 
    li 

효과적으로, 나는 온로드 문을했다 그것의 내부 .each 기능을 성공 시켰 : 같은대응하는 HTML DOM이 보일 수 있습니다. 둘째, each() 문 안에 function() {}을 추가했습니다. 이 함수는 0-4에서 임의로 숫자를 선택합니다. 각 숫자는 rndmClass 배열의 클래스에 해당하며 #container에있는 각 목록 항목에 해당 클래스를 추가합니다.

Answer 3

나는 당신을 위해 작동 할 수 있습니다 약간의 jQuery 플러그인을 작성했습니다. 그것을 확인하십시오 : https://github.com/cjthedizzy/randomClassJS