WEB recipe/jQuery

[jQuery] 예제 1, 예제 2

컵라면만두세트 2022. 5. 13. 14:39

jQuery 예제1)

  • 이미지 클릭시 이미지 변경

$(document).ready(function(){
	let num = 0;
	$("#im").click(function(){
		if(num == 0){
		$("#im").attr("src","./image/photo_b.jpg");
			
		}else{
			$("#im").attr("src","./image/photo_a.jpg");
		}
		
	});
	
});

jQuery 예제2)

  • 사진클릭스 속성값에 있는 값 출력하기
<body>
<h1>사진들</h1>
<img alt="성 자비에르 성당(외부)" src="./image/img01.jpg" id="b1">
<img alt="성 자비에르 성당(내부)" src="./image/img02.jpg" id="b2">
<img alt="은행" src="./image/img03.jpg" id="b3">
<img alt="가로등" src="./image/img04.jpg" id="b4">

<script type="text/javascript">
$(document).ready(function(){
	$("#b1").click(function(){
		let txt = $('#b1').attr("alt");
		alert(txt);
	});
	$("#b2").click(function(){
		let txt = $('#b2').attr("alt");
		alert(txt);
	});
	$("#b3").click(function(){
		let txt = $('#b3').attr("alt");
		alert(txt);
	});
	$("#b4").click(function(){
		let txt = $('#b4').attr("alt");
		alert(txt);
	});
	 
	
	
});

</script>
</body>