JS学习笔记

练习地址:http://www.fgm.cc/learn/lesson2/05.html

<script>
    window.onload = function(){
        var oDiv = document.getElementById('div1');
        // var oInput1 = document.getElementsByTagName('input')[0].value;
        // var oInput2 = document.getElementsByTagName('input')[1].value;
        // 不应该在window.onload 获取变量时就获取 value, 这样后面输入框的值发生变化就获取不到!!!
        var oInput1 = document.getElementsByTagName('input')[0];
        var oInput2 = document.getElementsByTagName('input')[1];
        
        var oBtn1 = document.getElementsByTagName('button')[0];
        var oBtn2 = document.getElementsByTagName('button')[1];

        oBtn1.onclick = function()
        {
            changeProperties(oDiv, oInput1.value, oInput2.value);
        };

        oBtn2.onclick = function()
        {
            oDiv.style.cssText = '';
            // oDiv.removeAttribute("style")  另一种方法。
        };
    };

    function changeProperties(obj, txt1, txt2) 
    {
        obj.style[txt1] = txt2; // style后面必须用[]把变量框起来,不能直接用. 点号
    };

    // 这里用var之后,前面怎么调用? 参考:
    // var myFn = function(a, b)
    // {
    //     alert(a.value);
    //     alert(b.value)    
    // };

    // oBtn.onclick = function()
    // {
    //     myFn(oInput[0],oInput[1])
    // };    

    </script>