Thursday, 18 November 2021

jQuery - Ngày 1

Jquery

Đoạn 1

Đoạn 2

Ẩn

Hiện

Ẩn - Hiện

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Jquery</title>
	<script type="text/javascript" src="jquery-3.6.0.min.js"></script>
</head>

<body>
	<script type="text/javascript">
	
	$(document).ready(function (){
		
		//Chọn đối tượng là thẻ html:
		/*$("p").click(function(){
			
			alert("Bạn vừa click vào đối tượng thẻ p");
		})*/
		
		//Chọn đối tượng là 1 class:
		$(".c1").click(function(){
			alert("Bạn vừa click vào class c1");
		})
		
		//Chọn đối tượng là 1 id:
		$("#id1").click(function(){
			alert("Bạn vừa click vào id1");
		})
		
		//viết code ẩn 1 đối tượng theo sự kiện:
		$("#an").click(function(){
			$("#id1").hide(1000); //đơn vị là ms
		})
		
		//Viết code hiện 1 đối tượng đã bị ẩn:
		$("#hien").click(function(){
			$("#id1").show(1000);
		})
		
		$("#anhien").click(function(){
			$(".c1").toggle(1000);
		})
		
		
	})
	</script>
<p class="c1">Đoạn 1</p>
<p id="id1">Đoạn 2</p>
<p id="an">Ẩn</p>
<p id="hien">Hiện</p>
<p id="anhien">Ẩn - Hiện</p>

</body>
</html>

2 comments: