时间戳

首页 > 解决方案 > 无法在循环中设置未定义的属性“innerHTML”

javascript - 无法在循环中设置未定义的属性“innerHTML”

问题描述

我想更改按钮的颜色，但我使用任何方法（样式、innerHtml、...）都会收到此消息

错误：未捕获的类型错误：无法设置未定义的属性“颜色”

html: ` 

        <div class="a-section backGround layer">
        </div>
        <div class="a-section layer">
            <div class="a-row dealDetailContainer">
                <div class="a-row a-spacing-mini">
                    <div class="a-row a-spacing-unspecified">
                        <span class="a-size-mini a-color-base hiddenCss">&nbsp;</span>
                        <span class="a-size-mini a-color-base badgeSkew"></span>
                    </div>
                </div>
                <div class="a-row stackToBottom">

                    <div class="a-row a-spacing-medium">

                        <span class="a-declarative">

                            <span class="a-button a-button-normal a-button-span12 a-button-primary fixedWidth210">
                                <span class="a-button-inner">
                                <button class="a-button-text a-text-center" type="button">
                                        Add to Cart
                                </button>

                                </span>
                            </span>
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

`

js：

var button = document.getElementsByClassName=(".a-button-primary .a-button-text");
var i;
for(i=0 ; i <= button.length ; i++){
  button[i].style.color = "blue";
}

标签： javascripthtmlcss

解决方案

正如@Heretic 的评论中所述，您的语法不正确。我发现的另一个问题是您正在循环超出返回元素的长度。在您的for循环中，您正在使用<=而不是<. 因为我们从, 开始0，<=会走得太远，undefined当循环超过实际元素长度时返回。

这是您尝试执行的操作的基本示例。

var button = document.getElementsByClassName("my-button");
for (var i = 0; i < button.length; i++) {
  button[i].style.color = "blue";
}
<button class="my-button">hello</button>
<button class="my-button">hello</button>
<button class="my-button">hello</button>

推荐阅读