Please help me | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 2

Please help me

please help me make div infinite have a interval 1000 with loop

10th May 2017, 11:03 AM
Kristina Hakobyan
Kristina Hakobyan - avatar
13 Answers
+ 14
window.onload = function () { // Interval of 1000 setInterval(function(){ // Create the element var div = document.createElement("div"); // Style the element div.style.width = "50px"; div.style.height = "50px"; div.style.border = "5px solid red"; // Append the element document.body.appendChild(div); }, 1000) } You have no need of loops, but if you want... you can insert the setInterval() in a while (true) { ... } loop. - Sorry but today my CodePlayground has some problems and i can't test it with the loop. - [ EDIT for @visph ] You are right! But for completeness, i want to said it. The best practice is "add a counter in your loop", or... in this case, use my function without any loops, because it's not necessary. =^=
10th May 2017, 11:18 AM
Maz
Maz - avatar
+ 11
@visph, that's why i don't used a loop, anyway your code is perfect for his question, i did not think to use innerHTML property for make a div in a loop!
10th May 2017, 12:28 PM
Maz
Maz - avatar
+ 5
Please reformulate your question more accuratly to be understood ^^ Would you generate html <div> element infinitly? This will necessarly end in a memory overflow error :P You need to limit the longer of the document generated... Anyway, do you talk about time interval or <div> height, or space between height? What's the unit of your '1000"? So... do you want generate it at run-time? Inside an html document, or as a new html content?
10th May 2017, 11:17 AM
visph
visph - avatar
+ 5
@Maz: With the infinite loop, you will crash your app ^^
10th May 2017, 11:21 AM
visph
visph - avatar
+ 5
@Maz wrote: << [ EDIT for @visph ] You are right! But for completeness, i want to said it. The best practice is "add a counter in your loop", or... in this case, use my function without any loops, because it's not necessary. =^= >> Without any loop, it's not what's expected ;P Well to do an infinite loop creating a new div every minutes and without using setTimeout/setInterval, you can save tthe creation time of the last div, and test inside the loop if time ellapsed greater than 1 minute ( 1000 milisecondes ) for creating a new <div>: window.onload = function() { var now, last=0; while (true) { now = Date.now(); if ((!last)||(now-last>1000)) { last = now; document.body.innerHTML+='<div style="height:20px; background:red; margin:3px;">div content</div>'; } } } Anyway, if you success to execute it ( in android web browers code playground it make the tab freeze -- not responding, only solution is to close the tab ), you need to be aware to not let it run too much long time, as you can even freeze a desktop pc, with only solution of hard reboot :P ( personnaly I prefer no longer test it, those thing becomes already too much often without expecting them ^^ )
10th May 2017, 12:22 PM
visph
visph - avatar
+ 5
@Maz: innerHTML is the lazy solution :P even if there's cases where it can be more efficient than using the DOM API ;)
10th May 2017, 12:30 PM
visph
visph - avatar
+ 4
Why do you want infinite loop? Are you expecting ADDING <div> infinitly, or just changing a <div> content infinitly? In the second case, you can do it infinitly without memory overflow, but without loop ( as infinite loop will consume also infinite memory, even if less quickly than adding <div> infinitly ^^ ) [ edit ] "infinite loop will consume infinte memory"... in this context ( calling setTimeout() )
10th May 2017, 11:26 AM
visph
visph - avatar
+ 3
@Maz if you don't mind. Here is your code in my code playground https://code.sololearn.com/WoUP0kS7ISlS/?ref=app
10th May 2017, 11:49 AM
Calviղ
Calviղ - avatar
+ 3
@Kristina Do it in loop is easier but like most sequential programs, in javascript, you can't do loop forever, it will freeze the cpu for handling other tasks. You must exist the loop after certain execution period, the best way to do looping is in timer using setInterval
10th May 2017, 12:31 PM
Calviղ
Calviղ - avatar
+ 2
only want to use setinterval and ever minute make a div
10th May 2017, 11:18 AM
Kristina Hakobyan
Kristina Hakobyan - avatar
+ 2
ok I want with loop
10th May 2017, 11:21 AM
Kristina Hakobyan
Kristina Hakobyan - avatar
+ 2
how to make infinite loop make my div
10th May 2017, 11:23 AM
Kristina Hakobyan
Kristina Hakobyan - avatar
+ 2
@calvin I write it with creat but wanna with loop I can do it
10th May 2017, 12:25 PM
Kristina Hakobyan
Kristina Hakobyan - avatar