티스토리 뷰
* attr() - JQuery 라이브러리는 문서 객체 여러 개를 한 번에 선택
- 값을 추출할때는 파라미터값을 넣지 않고 값을 조작/지정할 때는 파라미터값도 넣어준다.
* 아래는 각 사진을 클릭하면 큰 사진으로 바꿔서 보여준다. 각 이미지가 경로에 있어야한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>문서 속성 조작 exam</title>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$(document).ready(function(){
$('img').attr({width:50,height:50}); // 각 그림을 50x50 크기로 조작
});
function chg(img){ // 각 그림을 클릭하면 200x200 크기로 하단에 표시하여 조작
$('#mainImg').attr('src',img);
}
</script>
</head>
<body>
<img src="../source/image1.jpg" onclick="chg('../source/image1.jpg')">
<img src="../source/image2.jpg" onclick="chg('../source/image2.jpg')">
<img src="../source/image3.jpg" onclick="chg('../source/image3.jpg')">
<div></div>
<img id="mainImg" src="http://placehold.it/200x200" style="width:200px;height:200px">
</body>
</html>
'Language > JQuery' 카테고리의 다른 글
| [ JQuery ] TextArea 에 타이핑한 글자수를 보여주게 구현하기 - 확인전 (0) | 2016.01.02 |
|---|---|
| [ JQuery ] DIV POPUP (0) | 2016.01.02 |
| [ JQuery ] datepicker(); 달력 (0) | 2016.01.02 |
| [ JQuery ] Enter ( keyCode : 13 ) 처리 (0) | 2015.11.29 |
| [ JQuery ] radio change 연결 (0) | 2015.11.29 |