37 lines
1.1 KiB
HTML
37 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Timeout Test</title>
|
|
</head>
|
|
<body>
|
|
<h1>Timeout Test</h1>
|
|
<div id="immediate">This element is immediately available</div>
|
|
<div id="result"></div>
|
|
|
|
<script>
|
|
// Create the delayed element after 3 seconds
|
|
setTimeout(() => {
|
|
const delayed = document.createElement('div');
|
|
delayed.id = 'delayed';
|
|
delayed.textContent = 'This element appears after 3 seconds';
|
|
document.body.appendChild(delayed);
|
|
}, 3000);
|
|
|
|
// Create the slow button
|
|
const button = document.createElement('button');
|
|
button.id = 'slow-button';
|
|
button.textContent = 'Slow Button (3s delay)';
|
|
button.addEventListener('click', function() {
|
|
const result = document.getElementById('result');
|
|
result.textContent = 'Processing...';
|
|
|
|
// Simulate a slow operation
|
|
setTimeout(() => {
|
|
result.textContent = 'Button click processed!';
|
|
}, 3000);
|
|
});
|
|
document.body.appendChild(button);
|
|
</script>
|
|
</body>
|
|
</html>
|