如何在页面加载时延迟脚本

Question

我需要在页面加载过程中延迟自动滑块。我需要帮助bc，我不太喜欢JS。有人能帮我吗？

<script>
// User Settings
var transitionDuration = 1000; // set this to your "Slider Settings > Duration" in milliseconds
var slideInterval = 5000; // The interval at which the slider should change in milliseconds
var nextButton = '.next-button'; // The class name of your slider's "Next" button
// Automatic Timed Slider
var interval;

$(window).on('load', function(){
autoplay(slideInterval);
});

$(nextButton).on('click', function(){
var button = this;
$(button).css('pointer-events', 'none');
setTimeout(function(){
$(button).css('pointer-events', 'auto')
}, transitionDuration);
autoplay();
});

function autoplay(init){
clearInterval(interval);
if (init){
interval = setInterval(function(){
$(nextButton).click();
}, slideInterval);
} else {
interval = setInterval(function(){
$(nextButton).click();
}, slideInterval + transitionDuration);
}
}
</script>

也许用这样的东西？但我不知道合适的地方。

setTimeout(function(){
//deferred onload
}, 2000);

谢谢！

Answer 1

就我个人而言，我认为最好不要使用这样的延迟，但在客户端，你不会真正知道X秒后页面是否与你的页面相同。

不同的人，使用不同的电脑，会得到不同的结果

最好每隔1-2秒检查一次您想要发生的更改

如果发生了更改，则可以执行脚本并停止间隔

---

某些操作：

例如，假设2-3秒后，我们预计会出现一个div

我们可以通过选择具有相同类/id的所有元素，并使用长度计数来检查是否存在div。如果它为0，则表示它不存在。

document.querySelectorAll('.-img._glyph').length //=1
document.querySelectorAll('.-img._glyphSADCASDC').length //=0

现在，使用setInterval和clearInterval我们将继续检查。

我们将检查，直到我们的条件为真，然后停止我们的区间循环。

myInterval = setInterval(()=>{
console.log('myInterval interval called...');
if ( document.querySelectorAll('.-img._glyphSASA').length > 0 ) {
//YOUR CODE HERE
clearInterval(myInterval);
}
}, 1000);

Answer 2

const myTimeout = setTimeout(myGreeting, 3000);
function myGreeting() {
document.getElementById("demo").innerHTML = "Happy Birthday!"
}

<p>Wait 3 seconds...</p>
<h2 id="demo"></h2>