<strong>효과는 그림과 같습니다:</strong><br><img src="http://files.jb51.net/upload/201005/20100526201829788.gif" border="0" alt="jquery CSS 선택기 데모 code_jquery" ><br><strong>핵심 코드:</strong><br><div class="codetitle"> <span><a style="CURSOR: pointer" data="88506" class="copybut" id="copybut88506" onclick="doCopy('code88506')"><u>코드 복사 </u> </a></span> 코드는 다음과 같습니다. </div> <div class="codebody" id="code88506"> <br><script type="text/javascript"> 배경","#fff "); <br>$('div').css("배경","#fff"); <br>$('body div').css("배경","# bbffaa");// 본문에 있는 모든 div의 속성을 변경합니다. <br>$('div >span').css("Background","#bbffaa").css("color","red") .css("font-size" ,"12px");//모든 div 아래의 범위 요소 속성 변경<br>$('#two >.mini').css("Background","red" );// <br>$('#two').siblings("div").css("color","green") 내에서 클래스 mini가 있는 모든 요소의 ID가 2개인 div 속성;//선택 앞뒤 위치에 관계없이 #two 동료의 div 요소<br>$('div:first').css("Background","red") <br>$('div:gt(1)') .css("배경","#fff" );//인덱스 값이 1보다 큰 모든 div 요소<br>$('div:lt(1)').css("배경","노란색" ); <br>$('div:not(.one )').css("color","#cccccc");//클래스가 하나가 아닌 div 요소 변경<br>$('div:even ').css("font-size","15px") ;//인덱스 번호가 짝수인 div <br>$('div:odd').css("font-size","12px"); //홀수 인덱스 번호를 가진 div <br>$('div: contain(other)').css("font-size","10px");//other 텍스트를 포함하는 div 요소 설정<br> $('div:has(.mini)').css("color" ,"#bbffaa");//클래스 미니 요소를 포함하는 <div> 요소의 배경색 설정<br>$('div :parent').css("color","#ffcccc");// 하위 요소(텍스트 포함)를 포함하는 div 요소의 속성을 변경합니다. <br>$('div:hidden').show(3000); //숨겨진 div 가져오기 <br>$('div:visible')//보이는 div 가져오기 <br>$("div[title=test]").css("Background","black");// 제목을 테스트 div로 설정 <br>$("div[.mini][title =test]").css("color","red");//클래스가 mini이고 제목이 test </script><br><br><br>전체 데모 코드:</div> <br><br> <div class="htmlarea"> <textarea id="runcode96792"> jquery CSS 선택기 데모 코드<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title> </title> <style> div,span,p{ width:140px; height:140px; margin:5px; background:#aaa; border:#000 1px solid; float:left; font-size:17px; font-family:Verdana, Arial, Helvetica, sans-serif; } div .mini{ width:55px; height:55px; background-color:#aaa; font-size:12px; } </style> </textarea> </div>
