如何实现类似adiv.hide()的函数调用方法

用过jquery的都知道,jquery中有类似这样的$('#div').hide();函数调用方法,这样即可这个DIV隐藏掉....我想用纯JS来实现一个类似的函数,比如说
var adiv=document.getElementById('adiv');
adiv.hide();我想这样一调就隐藏adiv....
一般的函数我也会写比如
function DisplayDiv(id){
   if(document.getElementById(id)){
     document.getElementById(id).style.display ="none";
   }
}
这个函数就可以用DisplayDiv('adiv');来调用....但我不要这种,我想用elm.func();这样的调用方式我想知道类似的方法应该怎么写,请高人给个思路或者简单的小例子...感激不尽

解决方案 »

  1.   

    document.getElementById(id).style.display ="none";
    估计大概也就差不多是这样吧
      

  2.   

    用过jquery的都知道,jquery中有类似这样的$('#div').hide();函数调用方法,这样即可这个DIV隐藏掉....
    ----------------------其实 $ 就是个函数,类似于(function(){})() 
    但我不要这种,我想用elm.func();这样的调用方式elm是ID？name？类名？还是一个对象？ 
      

  3.   

    这个elm表示一个通过getElementById得到的一个元素...是一个对象吧
      

  4.   

    1、jquery的所有操作都把dom对象包在一个$()中对吧
    2、dom确实是一个对象，所有getElementById()取到的也都是一个对象。他们继承自HTMLElement。继而继承自Node。但是IE下不能访问Node或HTMLElement我给你一个代码 你在FF下运行看看，再到IE下试试<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <title></title>
    <script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
    <script type="text/javascript">
    Node.prototype.close = function(){
    this.style.display = "none";
    };
    window.onload = function(){
    document.getElementById("btnClose").onclick = function(){
    document.getElementById("test").close();
    };
    };
    </script>
        </head>
        <body>
    <div id="test" style="height:100px;width:100px;border:2px #ccc solid;background:#eee;"></div>
    <input type="button" value="关闭" id="btnClose" />
        </body>
    </html>
      

  5.   


    果然,在FF中成功执行在IE中就不行....那不是就没戏了
      

  6.   

    封装呗。不过那就成了库了 和jquery一样了~
      

  7.   

    <div id='autoshow' >aaaaaaa</div>
    <button onclick="document.getElementByMyId('autoshow').toggle()">click me</button>
    <script>document.getElementByMyId = function(){
    var showFlag = true;
    return function(d){
    var doms = document.getElementById(d);
    return {
    hide:function(){
    showFlag = false;
    doms.style.display = 'none';
      }
     ,show:function(){
    showFlag = true;
    doms.style.display  = '';
      }
     ,toggle:function(){
    this[showFlag ? 'hide' : 'show']();
     }
    }
    }
    }()
    </script>