元素的 Javascript 100% 宽度

Question

您好，有什么方法可以检查进度条等元素的宽度是否为 100%？

我试过了，但没用

let i = 0;
function start() {
    if (i == 0){
        i = 1;
        let elem = document.getElementById("myBar");
        let width = 10;
        let id =  setInterval(frame, 60);

        function frame() {
            if (elem.getAttribute("width") >= '100 %') {
                document.getElementsByTagName('form')[0].submit();
                clearInterval(id);
                i = 0;
            }
            else {
                width++;
                elem.style.width = width + '%';
            }
        }
    }
}

编辑：html代码：

<div id ="myProgress">
   <div id="myBar"></div>
</div>

Answer 1

如果您需要样式中的原始属性，请使用element.style.width它将返回字符串值（如果通过样式属性设置）。 如果您需要结果值，请使用window.getComputedStyle(element).width这将以 px 为单位返回值

涉及： 如何在 JavaScript 中获取 HTML 元素的样式值？

Answer 2

空的 div 默认不占用空间，你要么需要在里面添加内容，要么使用 CSS

另外if (elem.getAttribute("width") >= '100 %')应该是if (width >= 100)

 function start() { let elem = document.getElementById("myBar"); let width = 10; let id = setInterval(frame, 60); function frame() { if (width >= 100) { // document.getElementsByTagName('form')[0].submit(); clearInterval(id); width = 10; } else { width++; elem.style.width = width + '%'; } } } start()

 #myProgress { background-color: #ccc; width: 100%; } #myBar { background-color: #00ff00; width: 0% } #myBar:after { content: '\200b'; }

 <div id="myProgress"> <div id="myBar"></div> </div>