<div class="codetitle"> <span><a style="CURSOR: pointer" data="37474" class="copybut" id="copybut37474" onclick="doCopy('code37474')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code37474"> <br>[code] <br><script type=" text/javascript "> <br>var loading = { <br>element: null, <br>count: 0, <br>ID: 0, <br>createLoading: function(parent, width, height){ // 주변기기 진행률 표시줄 상자를 생성하는 데 사용됩니다. <br>loading.element = document.createElement("div"); <br>loading.element.id = "loading"; <br>loading.element.className = "loading"; 🎜> loading.element.style.height = 높이; <br>loading.element.style.BackgroundColor = "#ffffff"; <br>loading.element.style.border = "1px solid #333333" <br>loading .element .style.width = width; <br>parent.appendChild(loading.element); <br>loading.interval() <br>}, <br>addSubDIV: function(){ //setInterval을 사용하여 추가 외부 상자 div 태그는 진행 효과를 구현합니다<br>//외부 상자의 너비에 도달하면 진행 상황이 다시 표시됩니다<br>if ((loading.count 1) * 2 >= parsInt(loading.element .style.width)) { <br>loading.count = 0; <br>clearInterval(loading.ID); <br>loading.element.innerHTML = "" <br>loading.interval(); } <br>else { <br>var elem = document.createElement("div"); <br>elem.className= sub-loading; <br>elem.style.BackgroundColor = "#f00"; .style.width = "2px "; <br>elem.style.height = loading.element.style.height; <br>elem.style.display="inline" <br>loading.element.appendChild(elem) ; <br>loading.count ; <br>} <br>}, <br>interval: function(){ //반복적으로 호출 <br>loading.ID = setInterval(loading.addSubDIV, 30); <br>} <br> onload = function(){ <br>loading.createLoading(document.getElementById("parent"), "402px", "15px") <br>} <br></script> <br><br><br>[/code]<br>데모 코드 실행:<br> </div> <br> <br> <br><div class="htmlarea"> <textarea id="runcode45760">JavaScript 데이터 액세스 테스트 <title> </title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style>.sub-loading { DISPLAY: inline } </style> <meta content="MSHTML 6.00.6000.16850" name="GENERATOR"> <div id="parent"> </div> </textarea> <br>[Ctrl A 氇</div>