.settimeout()
Định nghĩa và sử dụng .setTimeout() xác định thời gian sau bao lâu thì thực hiện hành động. .setTimeout() được sử dụng rất nhiều trong thiết kế hiệu ứng, ví dụ: box quảng cáo xuất hiện sau 10 giây thì tự động đóng lại. .setTimeout(function(){}, time) Cấu trúc setTimeout(function(){ alert(“Hello!”); }, time); Html viết: <!DOCTYPE […]
Định nghĩa và sử dụng
.setTimeout()xác định thời gian sau bao lâu thì thực hiện hành động..setTimeout()được sử dụng rất nhiều trong thiết kế hiệu ứng, ví dụ: box quảng cáo xuất hiện sau 10 giây thì tự động đóng lại.
.setTimeout(function(){}, time)
Cấu trúc
setTimeout(function(){
alert("Hello!");
}, time);
Html viết:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
var myFnc = function(){
$('li').first().remove();
};
setTimeout(myFnc, 3000);
});
</script>
</head>
<body>
<ul>
<li>Thành phần thứ 1</li>
<li>Thành phần thứ 2</li>
<li>Thành phần thứ 3</li>
<li>Thành phần thứ 4</li>
<li>Thành phần thứ 5</li>
</ul>
</body>
</html>
Hiển thị trình duyệt:
- Thành phần thứ 1
- Thành phần thứ 2
- Thành phần thứ 3
- Thành phần thứ 4
- Thành phần thứ 5
Ta thấy thành phần đầu tiên trong danh sách sẽ biến mất sau 3 giây.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
| <ul>
<li>Thành phần thứ 1</li> <li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> |
<ul>
<li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> |
