JS处理Button的隐藏与显示

Html中Button的display属性控制着此Button的隐藏与显示功能，当display=="none"的时候是隐藏，display==“block”的时候是显示；并且display是存在于style中的。在Html中进行display属性的设置，请看如下代码：

        <div>
            <button id="displayBtn" style="background-color:#666666; display:block;">Display Button</button>
            <button id="hiddenBtn" style="background-color:#666666; display:none;">Hidden Button</button>
        </div>

知道了哪个属性控制Button的隐藏与显示，以及属性所在的位置后，在JS中调用与设置就变得很简单了（注意层次关系）。代码如下：

function DisplayAndHiddenBtn(btnId, type) {
var currentBtn = document.getElementById(btnId);
if (type == "d") {
        currentBtn.style.display = "block"; //style中的display属性
    }
else if (type == "h") {
        currentBtn.style.display = "none";
    }
}

这里的参数btnId标识Button的Id，type则表示需要将此Button设置成隐藏（“h”）还是显示（“d”）状态。

关于Button的属性还有很多，像onmouseover，onmouseout，onclick等事件注册函数，这里就不一一说明啦。