مجموعة النافذة
أمثلة
عرض "Hello" كل ثانية (1000 مللي ثانية):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
مرحبًا بك كل ثانية:
setInterval(displayHello, 1000);
المزيد من الأمثلة أدناه.
التعريف والاستخدام
تستدعي setInterval()الطريقة دالة في فترات زمنية محددة (بالمللي ثانية).
تستمر setInterval()الطريقة في استدعاء الوظيفة حتى
clearInterval()يتم استدعاؤها ، أو يتم إغلاق النافذة.
1 ثانية = 1000 مللي ثانية.
ملحوظة
لتنفيذ الوظيفة مرة واحدة فقط ، استخدم setTimeout()الطريقة بدلاً من ذلك.
لمسح فاصل زمني ، استخدم المعرف الذي يتم إرجاعه من setInterval ():
myInterval = setInterval(function, milliseconds);
ثم يمكنك إيقاف التنفيذ عن طريق استدعاء clearInterval ():
clearInterval(myInterval);
أنظر أيضا:
بناء الجملة
setInterval(function, milliseconds, param1, param2, ...)
المعلمات
| Parameter | Description |
| function | Required. The function to execute |
| milliseconds | Required. The execution interval. If the value is less than 10, 10 is used |
| param1, param2, ... | Optional. Additional parameters to pass to the function Not supported in IE9 and earlier. |
قيمة الإرجاع
| نوع | وصف |
| رقم | معرّف جهاز ضبط الوقت. استخدم هذا المعرف مع clearInterval () لإلغاء المؤقت. |
مزيد من الأمثلة
مثال
اعرض الوقت كساعة رقمية:
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
مثال
استخدام clearInterval () لإيقاف الساعة الرقمية:
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
مثال
استخدام setInterval () و clearInterval () لإنشاء شريط تقدم ديناميكي:
function move() {
const element = document.getElementById("myBar");
let width = 0;
let id = setInterval(frame, 10);
function frame() {
if (width == 100) {
clearInterval(id);
} else {
width++;
element.style.width = width + '%';
}
}
}
مثال
التبديل بين لونين للخلفية مرة كل 500 مللي ثانية:
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
مثال
قم بتمرير المعلمات إلى الوظيفة (لا تعمل في IE9 والإصدارات السابقة):
setInterval(myFunc, 2000, "param1", "param2");
ومع ذلك ، إذا كنت تستخدم وظيفة مجهولة ، فإنها تعمل في جميع المتصفحات:
setInterval(function() {myFunc("param1", "param2")}, 2000);
دعم المتصفح
setInterval() مدعوم في جميع المتصفحات:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |