zoukankan      html  css  js  c++  java
  • JS给Element添加方法

    Property类库大家应该都知道,他里面的有个hide和show方法很好用,所以我也想自己弄个那样的方法来用,于是在网上收罗下资料,经过自己的消化整理,代码如下:

    <!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>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>扩展element</title>
    <script language="javascript" type="text/javascript">
    function Hide(element) {
        element.style.display = 'none';
        return element;
      }
    function Show(element) {
        element.style.display = '';
        return element;
      }
    
    var __G={'hide':Hide,'show':Show};
    function $(s){
      var el=document.getElementById(s);
      if(el && !el._extendedByMyScriptName){
        for(var i in __G){
          var _tmpFn=function(_fn,_o){//delegate function
              return function(){
                if(typeof(_fn)=="function");
                  return _fn.apply(null,
                    [_o].concat(Array.prototype.slice.call(arguments)));
              }
          };
          el[i]=_tmpFn(__G[i],el);
        }
        //this statement is use to stop from too much recursion
        el._extendedByMyScriptName=true;
      }
     return el;
    }
    function test1()
    {
    $('Label1').hide();
    }
    
    function test2()
    {
    $('Label1').show();
    }
    
    </script>
    </head>
    
    <body>
    <label id="Label1">asdfasdfsadfasdf</label>
    <input id="btn1" name="Button1" type="button" value="隐藏" onclick="test1()" />
    <input id="btn2" name="Button2" type="button" value="显示" onclick="test2()" />
    </body>
    
    </html>

    分析上面的代码,实际上时在$函数里为调用该函数后返回的对象添加一个hide和show方法.

    具体的那些属性方法,别人从哪里找来的 我也就不清楚了,不过我放到不通的浏览器测试,确实都有这些属性和方法.所以说人外有人,山外有山.总会有别人知道而你不知道的东西.虚心向学,多多积累,积少成多,才是一个搞技术,学习技术的人 应该具备的良好习惯!!

    说明:当时查的网址现在不记得,不过这个效果的确很拉风,如果举一反三应该会有很大作用.

    测试结果:IE6.0,FireFox,Chrome,Opera均通过.

    作者:任磊

  • 相关阅读:
    第一次来博客园,不写技术
    asp.net跳转页面的三种方法比较
    那年五月
    在GridView里使用单选按钮,RadioButton/Radio
    常用网页嵌入播放器代码精解收集
    HTML 嵌入视频
    代码规范
    C:\WINDOWS\system32\wmp.dll”受到“Windows 系统文件保护”。
    window.pageyoffset和document.body.scrollTop
    网页制作中段落缩进的5种解决方法
  • 原文地址:https://www.cnblogs.com/Ren_Lei/p/1839639.html
Copyright © 2011-2022 走看看