javascript - 在Javascript中的另一个页面中传输进度条？

Question

我有一个显示进度条的 Javascript 函数？

<script type="text/javascript">
Counter = 10;
function DoCounter()
{
    SlideParent = document.getElementById("SliderParent");
    Slide = document.getElementById("Slider");
    Slide.style.width = Counter + "%";
    Slide.innerHTML = Counter + "%";
    if(Counter <25)
    {
        SlideParent.style.borderColor = "green";
        Slide.style.backgroundColor = "green";
    }
    else if(Counter >= 25 && Counter < 50)
    {
        SlideParent.style.borderColor = "blue";
        Slide.style.backgroundColor = "blue";
    }
    else if(Counter >= 50 && Counter < 75)
    {
        SlideParent.style.borderColor = "orange";
        Slide.style.backgroundColor = "orange";
    }
    else
    {
        SlideParent.style.borderColor = "red";
        Slide.style.backgroundColor = "red";
    }
    if(Counter++ < 100)
    {
        setTimeout("DoCounter()",100);
    }
}

</script>

这就是我在正文标签中的内容：

<div id="sync"><input type="submit" onclick="DoCounter();" /></div>
<div id="SliderParent" style="width:100%;">
    <div id="Slider" style="width:0%; border-width:0px; background-color:red; color:white">
        0%  
    </div>
</div>

当用户单击提交时，进度条会加载到同一页面中。我希望进度条加载到同一页面，但我删除了所有内容。document.write("Uploading..Please Wait")这样做。我想删除所有内容并在Uploading ..Please Wait下面添加进度条。我怎样才能做到这一点？