오락기/js
jQuery selector
문방구앞오락기
2017. 4. 18. 10:47
<ul>
<li class="marked">html</li>
<li>css</li>
<li id="active">JavaScript
<ul>
<li>JavaScript Core</li>
<li class="marked">DOM</li>
<li class="marked">BOM</li>
</ul>
</li>
</ul>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$( ".marked", "#active").css( "background-color", "red" ); //marked class에 id가 active인 애들
</script>
결과
<
ul
>
<
li
class
=
"marked"
>html</
li
>
<
li
>css</
li
>
<
li
id
=
"active"
>JavaScript
<
ul
>
<
li
>JavaScript Core</
li
>
<
li
class
=
"marked"
style
=
"background-color: red;"
>DOM</
li
>
<
li
class
=
"marked"
style
=
"background-color: red;"
>BOM</
li
>
</
ul
>
</
li
>
</
ul
>
=> 같은의미
$("#active .marked").css("background-color", "red");
find
=> $("#active").css('color', 'blue').find(".marked").css('background-color' , 'red');