jQuery 선택된 것의 배경색 변경하기(셀렉터 사용하기(next(),nextAll(),prev(),prevAll(),siblings() 실습)
조은성
2012. 6. 12. 15:58
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="../jquery-1.7.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ // $("#ul1 li.third-item").next().css("background","brown"); // $("#ul1 li.third-item").prev().css("background","yellow"); //위에 두줄을 한줄로 해결하려면 $("#ul1 li.third-item").next().css("background","brown").end().prev().css("background","yellow");
$("#ul2 li.third-item").nextAll().css("background","pink");//id가 third-item 것의 다음부분의 모든 것들의 배경을 pink로 변경 $("#ul2 .third-item").nextAll(".a").css("color","red"); //id가 third-item 것의 다음부분의 모든 것들중 class가 a인 것의 글씨를 빨강으로 변경 $("#ul2 .third-item").prevAll().css("background","green").css("color","white");//id가 third-item 것의 앞부분의 배경색을 모두 green으로 변경 $("#ul3 .third-item").siblings().css("background","crimson");//id가 third-item 것을 제외한 나머지를 cromson 색으로 변경
$(".third-item").nextAll(":contains(5)").css("font-weight","bold"); //id가 third-item인 것들 중 텍스트로 5를 가진 것들의 글씨 두께를 진하게로 변경 });
