JS控件替换，将 input、textarea、Select等控件替换成 span

 

最近项目中要将输入控件转换成 SPAN或DIV，因此专门写了这么一个方法，现在共享给大家，如果有更好的建议还请大家指教。

 

 /**//*
  功能：过滤HTML控件，将输入控件替换成SPAN
  Author: Kim
  DateTime: 2008-12-29
  参数说明：elements 要删除的控件数组；
 */
 function RemoveControl(elements)
 {
  var arrObj = new Array();
  
  var count = elements.length;
  for(var i=0;i<count;i++)
  {
   if(elements[i] == undefined)
    continue;
    
   var obj = document.createElement('span');
   switch(elements[i].type)
   {
    case "text" : 
      obj.setAttribute("innerHTML",elements[i].value);
      break;
    case "textarea" :
      obj.setAttribute("innerHTML",elements[i].innerHTML);
      elements[i].innerHTML = '';
      break;
    case "select-one" :
      for(var j=0;j<elements[i].length;j++)
      {
       if(elements[i][j].selected)
       {
        obj.setAttribute("innerHTML",elements[i][j].text);
        break;
       }
      }
      elements[i].options.length = 0;
      break;      
   }
   elements[i].parentNode.appendChild(obj);
   arrObj[arrObj.length] = elements[i];
  }
  
  //删除表单原控件
  for(var i=0;i<arrObj.length;i++)
  {
   arrObj[i].removeNode();
  }
 }

 

 

 /**//*
    调用事例
 */
function Filter()
 {
  //document.getElementById('tab_Forms').innerHTML = document.getElementById('tab_Forms').innerHTML.replace(/''/g,'');//  
  /**//* input Filter */  
  var elements = document.getElementById('tab_Forms').getElementsByTagName('input');
  RemoveControl(elements); 
  
  /**//* TextArea Filter */ 
  elements = document.getElementById('tab_Forms').getElementsByTagName('textarea');
  RemoveControl(elements); 
  
  /**//* select */
  elements = document.getElementById('tab_Forms').getElementsByTagName('select');
  RemoveControl(elements);   
  
  //alert(document.getElementById('tab_Forms').innerHTML);  onload="Filter();"               
 }