显示层||隐藏层

来源:互联网 发布:甘特图软件 编辑:程序博客网 时间:2024/04/24 15:10
window.onload = function () {
            document.getElementById('btnShow').onclick = function () {
                document.getElementById('dv').style.display = 'block';
            };
            document.getElementById('btnHidden').onclick = function () {
                document.getElementById('dv').style.display = 'none';
            };
            document.getElementById('btn').onclick = function () {
                var dvObj = document.getElementById('dv');
                if (dvObj.style.display.length == 0 || dvObj.style.display == 'none') {
                    dvObj.style.display = 'block';
                } else {
                    dvObj.style.display = 'none';
                }
            };
        };
<input type="button" name="name" value="显示" id="btnShow" />
    <input type="button" name="name" value="隐藏" id="btnHidden" />
    <input type="button" name="name" value="显示与隐藏" id="btn" />
    <div id="dv" style=" width:300px; height:200px; background-color:Green; display:none;">  
</div>
0 0