this的应用

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            li {
                list-style: none;
                width: 114px;
                height: 140px;
                background: url(img/normal.png);
                float: left;
                margin-right: 20px;
            }
        </style>
        <script>
            window.onload = function() {
                var oLi = document.getElementsByTagName(‘li‘);
                for(var i = 0; i < oLi.length; i++) {
                    oLi[i].onOff = true;
                    oLi[i].onclick = function() {
                        if(this.onOff) {
                            this.style.background = ‘url(img/active.png)‘;
                            this.onOff = false;
                        } else {
                            this.style.background = ‘url(img/normal.png)‘;
                            this.onOff = true;
                        }
                    }
                }
            }
        </script>
    </head>

    <body>
        <ul>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </body>

</html>

示例代码

时间： 2024-11-02 16:46:58