Question

目前我正在尝试使用按钮单击事件上的类名更改div容器的背景图像，并且我在控制台上出现此错误“无法设置未定义的属性backgroundImage”。无法理解代码中的错误。

<!DOCTYPE html>
<html>
    <head>
        <script>
            function slide()
            {
                var ele = document.getElementsByClassName("banner-section");
                ele.style.backgroundImage = "url(image-2.png)";
            }
        </script>
    <head>
    <body>
        <!--Main Container Start-->
        <div class="main-container">

            <!--Header Section Starts-->
            <div class="header-section">
                <!--<img id="logo" src="images/logo/logo-2.png">-->

                <!--Navigation Section Starts-->
                <div class="navigation-section">
                    <ul>
                        <li><a href="#">Home</a></li>
                        <li><a href="#">About Us</a></li>
                        <li><a href="#">Our Services</a></li>
                        <li><a href="#">Portfolio</a></li>
                        <li><a href="#">Contact Us</a></li>
                    </ul>
                </div>
                <!--Navigation Section Ends-->

            </div>
            <!--Header Section Ends-->

            <!--Banner Section Starts-->
            <div class="banner-section" id="x">
                <button onclick="slide2()">Previous</button>
                <button onclick="slide()">Next</button>

            </div>
            <!--Banner Section Ends-->
        </div>
        <!--Main Container Ends-->

    </body>
</html>

Answer 1

尝试

var ele = document.getElementsByClassName("banner-section")[0]

因为getElementsByClassName返回一个元素数组。

无法设置undefined的属性backgroundImage

1 个答案: