JS错误记录 - 微博发布

 

 

    <style>
    *{ margin: 0; padding: 0;}
    #ul1{
        width: 400px;
        height: 400px;
        border: 1px solid #000;
        margin: 10px auto;
        padding: 4px;
        overflow: hidden;
    }

    /* #ul li 选择器写错了！！！ */  

    #ul1 li{
        border-bottom: 1px #999 dashed;
        padding: 4px;
        list-style: none;
        overflow: hidden;
        filter:alpha(opacity=0); 
        opacity: 0;
        /* border-bottom: 1px dashed;  border没有设置颜色！！！ */
        /* filter: alpha = 0; 格式错误！！ */
    }
    </style>

    <script src="move2.js"></script>

    <script>
    window.onload = function()
    {
        var oTxt = document.getElementById('txt1');
        var oBtn = document.getElementById('btn1');
        var oUl = document.getElementById('ul1');

        oBtn.onclick = function() 
        {
            var oLi = document.createElement('li');

            oLi.innerHTML = oTxt.value;
            oTxt.value = '';

            if(oUl.children.length>0)
            {
                // oUl.insertBefore(oLi, oUl.childNodes[0])  
                // 注意childNodes 和 children的区别
                oUl.insertBefore(oLi, oUl.children[0]);
            }
            else
            {
                oUl.appendChild(oLi); // 添加的子节点值是不是这样写的？
            };

            var iHeight = oLi.offsetHeight;
            oLi.style.height = '0';

            startMove(oLi, {height: iHeight}, function()
            {
                startMove(oLi, {opacity: 100})
            });
        };
    };
    </script>
</head>
<body>
<textarea id="txt1" cols="30" rows="4"></textarea>
<input type="button" value="发布" id="btn1">
<ul id="ul1"></ul>
</body>

 

posted @ 2019-01-05 13:38  CarpenterZoe  阅读(200)  评论(0)    收藏  举报