使用JavaScript显示或隐藏html对象

为了满足情境需要，在html页面加载时，需要将html对象隐藏，当调用html对象时，再将该对象显示出来。JavaScript怎样实现这一项功能呢？下面，以div为例讲解一下。

整理思路：

1. 我们在主页面上定义一个button作为触发器，使用button的onclick事件

2. 定义一个“id=show” 的隐藏的div，关键是把属性值display设为none

3. 编写JavaScript脚本函数，功能是实现div可以show出来

 

把握关键点：

根据上面的思路，关键点有两个，一个是div的属性值display的设定，另一个是JavaScript的function

 

分析所需参数：

     e: 注册事件

     isShow: bool类型值

     _id: div标签ID

需要编写脚本function ：

   function setPosition(e,isShow,_id){
        var oDiv=document.getElementById(_id);
        if(isShow){
             var isIe=navigator.appName.indexOf("Microsoft")!=-1?true:false;
             oDiv.style.top=isIe?event.clientY+"px":e.pageY+"px";
             var iLeft=isIe?event.clientX-100:e.pageX;
             oDiv.style.left=iLeft+"px";
             if(isShow) oDiv.style.display="";
       }
       else
        oDiv.style.display="none";
    }

     简单吧？使用JavaScript显示或隐藏html对象，就这么轻松的实现了！其他的html对象也是使用同样的方法。不再赘述。