Я выучил JS несколько дней назад и увидел две очень интересные функции, а именно функцию Settimeout и функцию SetInterval. Эти две функции могут предоставлять веб -страницы очень распространенные эффекты на веб -страницы, такие как карусели с изображением, и некоторые очень забавные эффекты. Давайте узнаем об этих двух функциях ниже!
Синтаксис и применение функции установки и функции SetInterval
1.setTimeout Функция
Определение и использование: метод settimeout () используется для вызова функции или вычисления выражения после указанного числа миллисекунд.
Синтаксис: SetTimeout (Code, Millisec);
Параметр:
Код (требуется): строка кода JavaScript, которая будет выполнена после вызова функции.
Millisec (требуется): количество миллисекундов, чтобы ждать перед выполнением кода.
намекать:
setTimeout () выполняет код только один раз. Если вы хотите позвонить несколько раз, используйте setInterval () или снова попросите самого кода settimeout ().
Возвращаемое значение
Значение, которое можно передать в window.cleartimeout () для отмены периодического выполнения кода.
Поскольку SetTimeout является функцией таймера, есть функции для очистки таймера, поэтому мы используем функцию ClearTimeout.
ClearTimeOut (значение ID возвращается SETTIMEOUT ());
2.setInterval определение
Метод setInterval () вызывает функцию или вычисляет выражение в соответствии с указанным периодом (в миллисекундах).
Метод setInterval () будет непрерывно вызывать функцию до тех пор, пока не будет вызван ClearInterval () или окно не будет закрыто. Значение идентификатора, возвращаемое SetInterval (), может использоваться в качестве параметра для метода ClearInterval ().
грамматика
setInterval (code, millisec [, "lang"]);
Требуется код параметра. Функция, которая должна быть вызвана или строка кода, которая будет выполнена.
Миллисек должен. Интервал между периодическим исполнением или вызовом, в миллисекундах
Возвращаемое значение
Значение, которое может быть передано в window.clearinterval () для отмены периодического выполнения кода.
Поскольку SetTimeout является функцией таймера, существуют функции для очистки таймера, поэтому мы используем функцию ClearInterval ().
clearInterval () (значение ID, возвращаемое setInterval ());
2. Дело:
Эффект обратного отсчета
<! Doctype html> <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> effice> effect </effect> </xtml; "uTf-8"/> <Tuith JS Метод для достижения эффекта обратного отсчета VAR T1; window.onload = function () {// 01 позиция на кнопку запуска и вернуть объект dom var btns = document.getelementbyid ('btnstart'); // 02. Зарегистрируйте событие Click для кнопки «Пуск» btns.onclick = function () {// Выполнить функцию, которую должен регулярно выполнять первый параметр функции SetInterval, а второй параметр - это функция, которая выполняет все миллисекунд T1 = SetInterval (Start, 1000); } // 03 позиция к кнопке остановки, чтобы вернуть объект dom var btnst = document.getElementbyId ('btnstop'); btnst.onclick = function () {clearInterval (t1); }} // Функция для выполнения 1 вторая функция start () {// 01. Получить текст в div, чтобы назначить переменную var diold = document.getElementbyid ('msg'); var divnum = dieldm.innertext; // судить, является ли значение divnum 0 if (divnum> 0) {divnum--; // Пересмотреть вычитанное значение в divnum dioldm.innertext = divnum; }} </script> </head> <body> <input type = "button" id = "btnstart" value = "start"/> <input type = "кнопка" id = "btnstop" value = "stop"/> <br/> <div id = "msg"> 10 </div> </body> </html> <div = "msg"> 10 </div> </body> </html>Переключение фонового изображения:
<! Doctype html> <html xmlns = "http://www.w3.org/1999/xhtml"> <Head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> </titpe> 1; // Определите начальную переменную для первого изображения по умолчанию Window.onload = function () {// определить функцию SHOW каждую секунду, используя функцию таймера для выполнения SetInterval (Show, 1000); } // Функция для выполнения функции show () {// Если изображение достигает последнего (5 изображений), измените следующее отображаемое изображение на первое. Если последнее изображение не достигнуто, следующее изображение будет отображаться, если (count> 5) {count = 1; } else {count ++; } // Получить объект DOM с id myimg var dom = document.getelementbyid ("myimg"); // Измените атрибут SRC, указывающий на тег IMG и измените изображение dom.src = "image/"+count+". Jpg"} </script> </head> <body> <img src = "Image/1.jpg" id = "myimg"/> </body> </html>Имя вызывающего абонента
<! Doctype html> <html xmlns = "http://www.w3.org/1999/xhtml"> <Head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> </titpe> <script = html; harset = utf-8 "/> <title> </titpe> <script = html; массив для сохранения основных данных в NAMER VAR DATA = ['Zhang San', 'li Si', 'wang er', 'xiao chen', 'xiao Zhang']; var i = 0; // объявить начальную переменную, чтобы первое лицо отображалось на странице по умолчанию VAR T1; window.onload = function () {// 02. Получить объект DOM кнопки «Пуск», чтобы зарегистрировать событие Click для объекта var dom = document.getelementbyid ("myBtn"); dom.onclick = function () {// Использовать функцию setInterval, чтобы вызвать функцию результата t1 = setInterval (start, 500); // Этот метод только вызывает SetTimeout (Stop, 6000); } // Определите анонимную функцию, чтобы назначить ее с переменной result var var start = function () {// 03gate объект тега H1 и присвоить значение тексту тега H1 var domh = document.getElementbyId ("myh1"); domh.innertext = data [i % data.length]; // заменить существующий, значение элемента i ++; } // Вызовите анонимную функцию start (); var stop = function () {// очистить таймер clearInterval (t1); // Студенты, которые нажимают на окно подсказки, появляются и отвечают на оповещение («пожалуйста» + document.getElementById («MyH1»). InnerText + «Ответ студентов»); }}} </script> </head> <body> <h1 id = "myh1"> </h1> <button id = "mybtn"> запустить </button> </body> </html>Через вышеупомянутые случаи я считаю, что все должны быть знакомы с этими двумя функциями.
Приведенная выше статья имеет глубокое понимание функции SetTimeout и функции SetInterval. Эта статья - весь контент, которым я поделился с вами. Я надеюсь, что это может дать вам ссылку, и я надеюсь, что вы сможете поддержать Wulin.com больше.