Javascript 到达用户时如何停止追加'；特定的页面宽度是多少？

当

到达用户页面末尾时，如何停止追加？我是否必须构建一个固定宽度的div作为可以找到浏览器默认窗口设置的容器

$(document).ready(function () {

var color_array = ["red", "orange", "yellow", "green", "blue", "indigo", "violet"];
var randColor = color_array[Math.floor(Math.random() * color_array.length)];

setInterval(function() {
        for (i = 1; i <= 5; i++) {
            $("#box").append("<div style='background-color:" + randColor + "; height:20px; width:20px; float:left;'></div>"); 
            randColor = color_array[Math.floor(Math.random() * color_array.length)]; }
        }, .000001);
});

$（文档）.ready（函数（）{
var color_数组=[“红色”、“橙色”、“黄色”、“绿色”、“蓝色”、“靛蓝”、“紫色”]；
var randColor=color_数组[Math.floor（Math.random（）*color_数组.length）]；
setInterval（函数（）{
对于（i=1；i
（box=document.getElementById（'box'））。style.display='table'；//收缩包装
while（box.offsetWidth
当#box div占据所有剩余位置时的半坏解决方案。例如，附近有另一个div：


为了回答您的问题，您将需要有关此项的更多信息。您是否正在尝试创建一行随机彩色正方形来填充
#框的宽度？
(box = document.getElementById('box')).style.display = 'table'; //Shrink-wrap
while (box.offsetWidth < innerWidth) {
    box.innerHTML += "<div style='background-color:" + color_array[Math.floor(Math.random() * color_array.length)] + "; height:20px; width:20px; float:left;'></div>"; //No need for a randColor var
}
box.style.display = ''; //Get rid of inline styles

$("#box").css({'height' : $(window).height() - $("#bigDiv").height() + 'px'});
if ($("#box").height() >= $(window).height() -40) clearInterval(crazyInterval);