这样写正确吗

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>2-1</title>
    <style>
        /*补充代码*/
        li{
          width:200px;
          background:blue;
          margin-top:50px;
        }
        li:hover{
            cursor:pointer;
        }
    </style>
</head>
<body>
    <!-- 补充代码 -->
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <script>
        var li=document.getElementsByTagName("li");
        for(var i=0,len=li.length;i<len;i++){
            (function(i){
               // 补充代码
               li[i].onclick=function(){
                   alert(i);
               }
            })(i)
        }
    </script>
</body>
</html>

为爱修行 2019-02-24

源自：JavaScript 面向对象 2-9 编程练习