javascript获取元素对象

这是一个轻量级的元素对象获取方法，类似JQuery中的$()，但还没那么强大

/**
 * 返回指定id或name的元素标记
 * @param mark : 类似CSS的元素标记
 * e.g.  $('#id') ,$('.name'), $('tagName') 
 * 一次返回一个对象，内部设有指针，再次调用将返回集合的下一个元素
 */

// 存放对象结果集的指针
var objs_info = {};

function $(mark)
{
    if(typeof mark !== 'string' || mark.length < 1){
        console.log(typeof mark +" is not a string");
        return false;
    }

    var obj;
    // 如果其父也是经过 $()方法返回的
    if( this == parent){
        parentEle = this.document;
    }else{
        parentEle = this;
    }

    switch( mark[0] )
    {
        case '#':
             obj  = parentEle.getElementById( mark.substr(1) );
             break;
        case '.':
             var objs = parentEle.getElementsByName( mark.substr(1) );
             break;

        default:
             var objs = parentEle.getElementsByTagName( mark );
    }

    if(typeof objs == 'object'){
        if( typeof objs_info[mark]       == 'undefined' || 
            typeof objs[objs_info[mark]] != 'object'      ){
             // reset 重置指针
             objs_info[mark] = 0;
        }
        obj = objs[objs_info[mark]++];
    }
    
    if(typeof obj != 'object' || obj == null){
        console.log( mark +' is undefined'); 
    }else{
        // 为此元素递归绑定该方法
        obj.$ = $;
        return obj;
    }

}

 

调用方法就很简单：

  <menu style="margin:0px; padding:0px; " id="menu">
       <a href="/?" >
               <li class="menu"><span>index</span></li>
       </a>
       <a href="/?controller=user" >
               <li class="menu"><span>me</span></li>
       </a>
       <a href="/?controller=friend" >
               <li class="menu"><span>friend</span></li>
       </a>
  </menu>
  <script>
        /* 若参数为元素名，将返回的不是元素对象的集合，而是集合中的一个对象。
         * 依次调用将依次返回集合中的元素，若全部返回完再调用则从头开始。
        */
       // 重复调用4次
       $('menu').$('a').$('span').innerHTML;
       $('menu').$('a').$('span').innerHTML;
       $('menu').$('a').$('span').innerHTML;
       $('menu').$('a').$('span').innerHTML;
       /* 输出
          "index"
          "me"
          "friend"
          "index"
         */

        // 最前面为 # 号，将返回id如 menu 的元素
        $('#menu');
        // 结果同上
        $('menu');

 </script>

 

好吧暂时写到这，折腾了两小时，嗓子都干了