|
메소드 |
기능 |
parent() |
선택한 요소 바로 위에 있는 요소를 선택 |
Children() |
선택한 요소 아래에 있는 요소를 선택 |
Siblings([표현식]) |
선택한 요소의 모든 형제자매 요소 선택
(표현식) 기술시 해당 표현식에 만족하는 형제자매요소만 선택 |
Prev( ) |
선택한 요소 위치한 왼쪽(이전)에 있는 요소를 선택 |
Next() |
선택한 요소 위치한 오른쪽(이후)에 있는 요소를 선택 |
Example
dom구조를 숙지하고 살펴보면 이해하기가 더 쉽습니다.
<html>
<head>
<script src="js/jquery-1.12.2.min.js"></script>
<script>
$(document).ready(function()//현재 문서가 준비되면 함수를 사용하겠다.
{
$(".img").click(function(){
var a="<b> 요로콤 나옴</b>";
$("b").remove(); //현재문서에서 b태그는 다지워버리겠다!
$(".img").children("b").remove();
//img라는 class의 아래에 있는 계층인 b태그를 지워버리겠다!
$(this).append(a);
});
});
</script>
</head>
<body>
<div class="img">
<img src="1.jpg" width=200 height=200>
<h1> 고양이</h1>
</div>
<div class="img">
<img src="2.jpg" width=200 height=200>
<h1> 강아지</h1>
</div>
<div class="img2">
<img src="3.jpg" width=200 height=200>
<h1> 다람쥐</h1>
</div>
</body>
</html>
'웹프로그래밍 > jQuery' 카테고리의 다른 글
jQuery의 이벤트 처리 (0) | 2016.03.30 |
---|---|
jQuery의 필터제어 (0) | 2016.03.30 |
jQuery의 변수 (0) | 2016.03.28 |
jQuery-DOM요소 제어하기 (0) | 2016.03.28 |
jQuery의 메소드 (0) | 2016.03.26 |