티스토리 뷰
element 들 중의 첫번째에 해당하는 element를 선택한다.
위 예제에서 div 아래에 있는 span element들 중에 첫번째에 해당하는 element에 대해서 underline 효과를
주고 마우스 오버했을 경우 sogree css class를 부여하고 마우스 아웃할 경우 sogreen css class를 제거한다.
<!DOCTYPE html>
<html>
<head>
<style>
span { color:#008; }
span.sogreen { color:green; font-weight: bolder; }
</style>
<script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
<div>
<span>John,</span>
<span>Karl,</span>
<span>Brandon</span>
</div>
<div>
<span>Glen,</span>
<span>Tane,</span>
<span>Ralph</span>
</div>
<script>
$("div span:first-child")
.css("text-decoration", "underline")
.hover(function () {
$(this).addClass("sogreen");
}, function () {
$(this).removeClass("sogreen");
});
</script>
</body>
</html>위 예제에서 div 아래에 있는 span element들 중에 첫번째에 해당하는 element에 대해서 underline 효과를
주고 마우스 오버했을 경우 sogree css class를 부여하고 마우스 아웃할 경우 sogreen css class를 제거한다.
'jQuery' 카테고리의 다른 글
| ID Selector (“#id”) 와 Class Selector (“.class”) (0) | 2011.01.06 |
|---|---|
| Child Selector (“parent > child”) (0) | 2011.01.06 |
| :eq() Selector (0) | 2011.01.06 |
| Attribute Contains Word Selector [name~="value"] (0) | 2010.12.30 |
| Attribute Contains Selector [name*="value"] (0) | 2010.12.30 |
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크