<!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 http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head><body>
<table width="200" border="1" id="tab"></table>
<button onclick="AddCheckBoxRow()">添加行</button>
<button onclick="Dele()">删除选中行</button>
</body>
<script type="text/javascript">
var tab=document.getElementById("tab");
function AddCheckBoxRow(){
var cb=document.createElement("input");
cb.type="checkbox";
var tr=tab.insertRow(0);
var cell=tr.insertCell(0);
cell.appendChild(cb);
cb.Parent=tr;
tr.CB=cb;
}
function Dele(){
var i=0;
while(i<tab.rows.length){
if(tab.rows[i].CB.checked==true){
tab.deleteRow(i);
i--;
}
i++;
}
}
</script>
</html>

解决方案 »

  1.   

    <html>
    <head>
    <meta http-equiv="content-type" content="type=text/html; charset=gb2312">
    <style type="text/css">
    /*dhdatagrid 大块样式*/
    #dhdatagrid {position:relative;width:500px;height:200px;background:white;margin:0px;padding:0px;overflow:hidden;border:1px inset;-moz-user-select:none;}
    /*dhdatagrid 表格全局样式*/
    #dhdatagrid table {table-layout:fixed;margin:0px;}
    #dhdatagrid table td {height:18px;cursor:default;font-size:12px;font-family:verdana;overflow:hidden;white-space:nowrap;text-indent:2px;border-right:1px solid buttonface;border-bottom:1px solid buttonface;}
    #dhdatagrid table td .arrow {font-size:8px;color:#808080;}
    #dhdatagrid table .lastdata {border-right:none;}
    #dhdatagrid table .column {width:120px;cursor:default;background:buttonface;border-top:1px solid #fff;border-right:1px solid #404040;border-bottom:1px solid #404040;border-left:1px solid #fff;}
    #dhdatagrid table .over {width:120px;cursor:default;background:buttonface;border-top:1px solid #fff;border-right:1px solid #404040;border-bottom:1px solid #404040;border-left:1px solid #fff;}
    #dhdatagrid table .sortdown {width:120px;cursor:default;background:buttonface;border-right:1px solid #ffffff;border-bottom:1px solid #ffffff;border-left:1px solid #404040;border-top:1px solid #404040;position:relative;left:1px;}
    #dhdatagrid table .dataover {background:#FAFAFA;}
    #dhdatagrid table .firstcolumn {width:30px;text-indent:0px;text-align:center;background:buttonface;border-top:1px solid #fff;border-right:1px solid #404040;border-bottom:1px solid #404040;border-left:1px solid #fff;}
    #dhdatagrid table .lastcolumn {background:buttonface;border-top:1px solid #fff;border-right:1px solid #404040;border-bottom:1px solid #404040;border-left:1px solid #fff;}
    /*dhdatagrid 选定行样式*/
    #dhdatagrid table .selectedrow {background:highlight;color:white;}
    /*dhdatagrid 表头样式*/
    #dhdatagrid #titlecolumn {width:100%;position:absolute;top:0px;left:0px;z-index:3;}
    /*dhdatagrid 左边栏样式*/
    #dhdatagrid #slidecolumn {width:30px;position:absolute;top:0px;left:0px;z-index:2;}
    #dhdatagrid #slidecolumn td {width:30px;text-indent:0px;text-align:center;background:buttonface;border-top:1px solid #fff;border-right:1px solid #404040;border-bottom:1px solid #404040;border-left:1px solid #fff;}
    /*dhdatagrid 内容表体样式*/
    #dhdatagrid #datacolumn {width:100%;position:absolute;top:0px;left:0px;}
    /*dhdatagrid 原点样式*/
    #dhdatagrid #zero {width:30px;height:18px;margin:0px;padding:0px;position:absolute;top:0px;left:0px;z-index:10;background:buttonface;border-top:1px solid #fff;border-right:1px solid #404040;border-bottom:1px solid #404040;border-left:1px solid #fff;text-align:center;font-size:10px;color:#A19F92;}
    </style>
    <script language="javascript">
    function dhdatagrid(){
    //author:dh20156;
    this.callname = "dhdg";
    this.width = 500;
    this.height = 200;
    this.rid = "dhdatagrid";
    this.columns = [];
    this.data = [];
    this.dblclick_fun = function(){}
    this.contextmenu_fun = function(){}
    this.parentNode = document.body;var dh = this;
    var framediv = null;
    var zerobj = null;
    var leftobj = null;
    var titleobj = null;
    var dataobj = null;
    var hbar = null;
    var vbar = null;
    var bgbar = null;//改变列宽初始位置
    var ml = 0;
    //改变列宽对象初始宽度
    var ow = 0;
    //改变列宽对象
    var tdobj = null;
    //当前选定行索引
    var nowrow = null;
    //是否更改垂直滚动条位置
    var changeposv = true;this.init = function(){
      //init the data 初始数据
      var dgc = "";
      if(this.columns.length>0){
       dgc = "<tr><td class=\"firstcolumn\"> </td>";
       for(var cc=0;cc<this.columns.length;cc++){
        dgc += "<td class=\"column\" onmouseover=\""+this.callname+".over(this);\" onmouseout=\""+this.callname+".out(this);\" onmousemove=\""+this.callname+".cc(event,this);\" onmousedown=\""+this.callname+".rsc_d(event,this);\" onmouseup=\""+this.callname+".mouseup(this);\">"+this.columns[cc]+"<span class=\"arrow\"></span></td>";
       }
       dgc += "<td class=\"lastcolumn\"> </td></tr>";
      }  var dgs = "";
      var dgd = "";
      if(this.data.length>0){
       //第一列
       dgs = "<tr><td> </td></tr>";
       for(var r=0;r<this.data.length;r++){
        dgs += "<tr><td>"+(r+1)+"</td></tr>";
        dgd += "<tr onmouseover=\""+this.callname+".dataover(this);\" onmouseout=\""+this.callname+".dataout(this);\"><td class=\"firstcolumn\"> </td>";
        for(var c=0;c<this.data[r].length;c++){
         dgd += "<td ondblclick=\""+this.callname+".dblclick_fun(this);\" oncontextmenu=\""+this.callname+".contextmenu_fun(this);\">"+this.data[r][c]+"</td>";
    //alert(this.data[r][c]);
        }
        dgd += "<td class=\"lastdata\"> </td></tr>";
       }
       if(dgc==""){
        dgc = "<tr><td class=\"firstcolumn\"> </td>";
        for(var dc=0;dc<this.data[0].length;dc++){
         dgc += "<td class=\"column\" onmouseover=\""+this.callname+".over(this);\" onmouseout=\""+this.callname+".out(this);\" onmousemove=\""+this.callname+".cc(event,this);\" onmousedown=\""+this.callname+".rsc_d(event,this);\" onmouseup=\""+this.callname+".mouseup(this);\">Expr"+(dc+1)+"<span class=\"arrow\"></span></td>";
        }
        dgc += "<td class=\"lastcolumn\"> </td></tr>";
       }
      }
      //dhdatagrid frame 框架
      var dgframe = document.createElement("DIV");
      dgframe.id = this.rid;
      dgframe.onmousedown = function(e){e=e||window.event;getrow(e);}
      dgframe.onmousemove = function(e){e=e||window.event;rsc_m(e);}
      if(document.attachEvent){
       document.attachEvent("onmouseup",rsc_u);
      }else{
       document.addEventListener("mouseup",rsc_u,false);
      }
      dgframe.oncontextmenu = function(){return false}
      dgframe.onselectstart = function(){return false}
      ae(dgframe);
      

  2.   

      //dhdatagrid zero point 零点
      var dgzero = "<div id=\"zero\"></div>"  //dhdatagrid slidecolumn 第一列
      var dgslide = "<table cellpadding=\"0\" cellspacing=\"0\" id=\"slidecolumn\">"+dgs+"</table>";  //dhdatagrid column 标题栏
      var dgcolumn = "<table cellpadding=\"0\" cellspacing=\"0\" id=\"titlecolumn\">"+dgc+"</table>";  //dhdatagrid data 数据
      var dgdata = "<table cellpadding=\"0\" cellspacing=\"0\" id=\"datacolumn\">"+dgc+dgd+"</table>";  //dhdatagrid hbar 水平滚动条
      var dghbar = document.createElement("DIV");
      dghbar.id = "hbar";
      dghbar.style.position = "absolute";
      dghbar.style.width = "100%";
      dghbar.style.height = "17px";
      dghbar.style.top = this.height-17;
      dghbar.style.overflowX = "auto";
      dghbar.style.zIndex = "10";
      dghbar.onscroll = function(){scrh();}
      dghbar.innerHTML = "<div style=\"width:100%;height:1px;overflow-y:hidden;\"> </div>";  //dhdatagrid vbar 垂直滚动条
      var dgvbar = document.createElement("DIV");
      dgvbar.id = "vbar";
      dgvbar.style.position = "absolute";
      dgvbar.style.width = "17px";
      dgvbar.style.height = "100%";
      dgvbar.style.left = this.width-17;
      dgvbar.style.overflowY = "auto";
      dgvbar.style.zIndex = "10";
      dgvbar.onscroll = function(){scrv();}
      dgvbar.innerHTML = "<div style=\"width:1px;height:100%;overflow-x:hidden;\"> </div>";  //dhdatagrid bgbar 滚动条背景
      var dgbgbar = document.createElement("DIV");
      dgbgbar.id = "bgbar";
      dgbgbar.style.background = "buttonface";
      dgbgbar.style.position = "absolute";
      dgbgbar.style.width = "100%";
      dgbgbar.style.height = "17px";
      dgbgbar.style.top = this.height-17;
      dgbgbar.style.overflowX = "auto";
      dgbgbar.style.zIndex = "9";
      dgbgbar.style.display = "none";
      dgbgbar.innerHTML = " ";  //appendChild
      dgframe.innerHTML = dgzero+dgslide+dgcolumn+dgdata;
      dgframe.appendChild(dghbar);
      dgframe.appendChild(dgvbar);
      dgframe.appendChild(dgbgbar);  this.parentNode.appendChild(dgframe);  if(document.attachEvent){
       document.attachEvent("onkeydown",updown);
      }else{
       document.addEventListener("keydown",updown,false);
      }  framediv = dgframe;
      zerobj = document.getElementById("zero");
      leftobj = document.getElementById("slidecolumn");
      titleobj = document.getElementById("titlecolumn");
      dataobj = document.getElementById("datacolumn");
      hbar = dghbar;
      vbar = dgvbar;
      bgbar = dgbgbar;  var btt = getCurrentStyle(framediv,"borderTopWidth");
      var btr = getCurrentStyle(framediv,"borderRightWidth");
      var btb = getCurrentStyle(framediv,"borderBottomWidth");
      var btl = getCurrentStyle(framediv,"borderLeftWidth");
      var fh = getCurrentStyle(framediv,"height");
      var zh = getCurrentStyle(zerobj,"height");
      var zbt = getCurrentStyle(zerobj,"borderTopWidth");
      var zbb = getCurrentStyle(zerobj,"borderBottomWidth");  if(document.all){
       vbar.style.left = parseInt(vbar.style.left)-parseInt(btr)-parseInt(btl);
      }else{
       framediv.style.height = parseInt(fh)-parseInt(btb)-parseInt(btt);
       zerobj.style.height = parseInt(zh)-parseInt(zbb)-parseInt(zbt);
      }  hbar.style.top = parseInt(hbar.style.top)-parseInt(btb)-parseInt(btt);
      bgbar.style.top = parseInt(bgbar.style.top)-parseInt(btb)-parseInt(btt);
    }
    function getCurrentStyle(oElement, sProperty) {   
      if(oElement.currentStyle){   
       return oElement.currentStyle[sProperty];   
      }else if(window.getComputedStyle){   
       sProperty = sProperty.replace(/([A-Z])/g, "-$1").toLowerCase();   
       return window.getComputedStyle(oElement, null).getPropertyValue(sProperty);   
      }else{   
       return null;   
      }   
    }
    //设置块滚动条
    this.setwh = function(){
      hbar.style.display = "block";
      vbar.style.display = "block";
      hbar.childNodes[0].style.width = dataobj.offsetWidth;
      vbar.childNodes[0].style.height = dataobj.offsetHeight;
      if(hbar.childNodes[0].offsetWidth<=hbar.offsetWidth){
       hbar.style.display = "none";
      }else{
       hbar.style.display = "block";
      }
      if(vbar.childNodes[0].offsetHeight<=vbar.offsetHeight){
       vbar.style.display = "none";
      }else{
       vbar.style.display = "block";
      }
      if(hbar.childNodes[0].offsetWidth>hbar.offsetWidth && vbar.childNodes[0].offsetHeight>vbar.offsetHeight && changeposv){
       bgbar.style.display = "block";
       hbar.style.width = hbar.offsetWidth-17;
       vbar.style.height = vbar.offsetHeight-17;
       vbar.childNodes[0].style.height = vbar.childNodes[0].offsetHeight+17;
       changeposv = false;
      }
      if(hbar.childNodes[0].offsetWidth<=hbar.offsetWidth+17 && !changeposv){
       bgbar.style.display = "none";
       hbar.childNodes[0].style.width = 0;
       hbar.style.width = hbar.offsetWidth+17;
       vbar.style.height = vbar.offsetHeight+17;
       changeposv = true;
       if(vbar.offsetHeight-dataobj.offsetHeight>dataobj.offsetTop && document.all){
        leftobj.style.top = leftobj.offsetTop+17;
        dataobj.style.top = dataobj.offsetTop+17;
       }
      }
    }//鼠标滚轮,列表滚动事件
    function mwEvent(e){
      e=e||window.event;
      if(e.wheelDelta<=0 || e.detail>0){
       vbar.scrollTop += 18;
      }else {
       vbar.scrollTop -= 18;
      }
    }
    function ae(obj){
      if(document.attachEvent){
       obj.attachEvent("onmousewheel",mwEvent);
      }else{
       obj.addEventListener("DOMMouseScroll",mwEvent,false);
      }
    }//滚动条事件
    function scrv(){
      leftobj.style.top = -(vbar.scrollTop);
      dataobj.style.top = -(vbar.scrollTop);
    }function scrh(){
      titleobj.style.left = -(hbar.scrollLeft);
      dataobj.style.left = -(hbar.scrollLeft);
    }//选择行
    function getrow(e){
      e=e||window.event;
      var esrcobj = e.srcElement?e.srcElement:e.target;
      if(esrcobj.parentNode.tagName=="TR"){
       var epobj = esrcobj.parentNode;
       var eprowindex = epobj.rowIndex;
       if(eprowindex!=0){
        if(nowrow!=null){
         dataobj.rows[nowrow].className = "";
        }
      

  3.   


        dataobj.rows[eprowindex].className = "selectedrow";
        nowrow = eprowindex;
       }
      }
    }//更改列宽
    t s.rsc_d = function(e,obj){
      var px = document.all?e.offsetX:e.layerX-obj.offsetLeft;
      if(px>obj.offsetWidth-6 && px<obj.offsetWidth){
       e=e||window.event;
       obj=obj||t s;
       ml = e.clientX;
       ow = obj.offsetWidth;
       tdobj = obj;
       if(obj.setCapture){
        obj.setCapture();
       }else{
        e.preventDefault();
       }
      }else{
       if(nowrow!=null){
        dataobj.rows[nowrow].className = "";
       }
       if(obj.getAttribute("sort")==null){
        obj.setAttribute("sort",0);
       }
       var sort = obj.getAttribute("sort");
       if(sort==1){
        dgsort(obj,true);
        obj.setAttribute("sort",0);
       }else{
        dgsort(obj,false);
        obj.setAttribute("sort",1);
       }
       obj.className = "sortdown";
      }
    }
    t s.mouseup = function(obj){
      obj.className = "over";
    }
    function rsc_m(e){
      if(tdobj!=null){
       e=e||window.event;
       var newwidth = ow-(ml-e.clientX);   if(newwidth>5){
        tdobj.style.width = newwidth;
        dataobj.rows[0].cells[tdobj.cellIndex].style.width = newwidth;
       }else{
        tdobj.style.width = 5;
        dataobj.rows[0].cells[tdobj.cellIndex].style.width = 5;
       }
       dh.setwh();
       scrh();
      }
    }
    function rsc_u(e){
      if(tdobj!=null){
       e=e||window.event;
       var newwidth = ow-(ml-e.clientX);
       if(newwidth>5){
        tdobj.style.width = newwidth;
        dataobj.rows[0].cells[tdobj.cellIndex].style.width = newwidth;
       }else{
        tdobj.style.width = 5;
        dataobj.rows[0].cells[tdobj.cellIndex].style.width = 5;
       }
       if(tdobj.releaseCapture){
        tdobj.releaseCapture();
       }
       ml = 0;
       ow = 0;
       tdobj = null;
      }
      dh.setwh();
      scrh();
    }t s.cc = function(e,obj){
      var px = document.all?e.offsetX:e.layerX-obj.offsetLeft;
      if(px>obj.offsetWidth-6 && px<obj.offsetWidth){
       obj.style.cursor = "col-resize";
      }else{
       obj.style.cursor = "default";
      }
    }t s.over = function(obj){
      obj.className = "over";
    }t s.out = function(obj){
      obj.className = "column";
    }t s.dataover = function(obj){
      if(obj.rowIndex!=nowrow){
       obj.className = "dataover";
      }
    }t s.dataout = function(obj){
      if(obj.rowIndex!=nowrow){
       obj.className = "";
      }
    }//键盘Up & Down事件
    function updown(e){
      e=e || window.event; e=e.w ch || e.keyCode;
      var rl = dh.data.length;
      switch(e){
       case 38://Up;
        if(nowrow!=null && nowrow>1){
         vbar.scrollTop -= 18;
         dataobj.rows[nowrow].className = "";
         nowrow -= 1;
         dataobj.rows[nowrow].className = "selectedrow";
        };
        break;
       case 40://Down;
        if(nowrow!=null && nowrow<rl){
         vbar.scrollTop += 18;
         dataobj.rows[nowrow].className = "";
         nowrow += 1;
         dataobj.rows[nowrow].className = "selectedrow";
        };
        break;
       default:break;
      }
    }function dti(s){
      var n = 0;
      var a = s.match(/\d+/g);
      for(var i=0;i<a.length;i++){
       if(a[i].length<2){
        a[i] = "0"+a[i];
       }
      }
      n = a.join("");
      return n;
    }//排序
    function dgsort(obj,asc){
      var rl = dh.data.length;
      var ci = obj.cellIndex;
      var rowsobj = [];
      for(var i=1;i<dataobj.c ldNodes[0].rows.length;i++){
       rowsobj[i-1] = dataobj.c ldNodes[0].rows[i];
      }
      rowsobj.sort(function(trObj1,trObj2){
        if(!isNaN(trObj1.cells[ci].innerHTML.charAt(0)) && !isNaN(trObj2.cells[ci].innerHTML.charAt(0))){
         if(asc){
          return dti(trObj1.cells[ci].innerHTML)-dti(trObj2.cells[ci].innerHTML);
         }else{
          return dti(trObj2.cells[ci].innerHTML)-dti(trObj1.cells[ci].innerHTML);
         }
        }else{
         if(asc){
          return trObj1.cells[ci].innerHTML.localeCompare(trObj2.cells[ci].innerHTML);
         }else{
          return trObj2.cells[ci].innerHTML.localeCompare(trObj1.cells[ci].innerHTML);
         }
        }
       });
      for(var i=0;i<rowsobj.length;i++){
       dataobj.c ldNodes[0].appendC ld(rowsobj[i]);
      }
      for(var c=1;c<obj.parentNode.cells.length-1;c++){
       obj.parentNode.cells[c].c ldNodes[1].innerHTML = "";
      }
      if(asc){
       obj.c ldNodes[1].innerHTML = "▲";
      }else{
       obj.c ldNodes[1].innerHTML = "▼";
      }
    }
    }
    function AddRow(){
    var tab=document.getElementById("datacolumn");
    var cb=document.createElement("input");
    cb.type="checkbox";
    var tr=tab.insertRow(0);
    var cell=tr.insertCell(0);
    cell.appendC ld(cb);
    cb.Parent=tr;
    tr.CB=cb;
    }
    </script>
    </head>
    <body style="background:#ECE9D8;">
    <form name="form1" method="post" action="">
    <button onclick="AddRow()">添加行</button>
    </form>
    <script language="javascript">
    var dhdg = new dhdatagrid();
    dhdg.callname = "dhdg";
    dhdg.columns = ["1","2","3"];
    dhdg.data = [["000","5555","2006-12-6 17:06"],["22","333","444"]];
    dhdg.dblclick_fun = function(e){alert(e+',ondblclick');}
    dhdg.contextmenu_fun = function(e){alert(e+',oncontextmenu');}
    dhdg.init();
    dhdg.setwh();
    </script>
    </body>
    </html>
      

  4.   

    完整的代码控件三个回贴拼起来.AddRow()是我自己写的,但是完全没有达到按照表格自身模式添加新一行.
    希望哪个牛人帮忙看看要怎么改...
      

  5.   

    初学者做的 大家不要见笑哈
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">  <script language="javascript">
      
       var currenttr=null;
      
      function fastupdate(src)
    {
    var value=src.innerHTML;
    src.innerHTML="<input type='text' onkeydown='if (event.keyCode==13){save(this);}' name='newvalue' value='"+value+"' onblur='save(this)'>";
    src.firstChild.select();
    src.firstChild.focus();

    }

    function save(src)
    {
    var div=src.parentNode;
    div.innerHTML=src.value;
    }

    function add(form)
    {
    var username=form.username.value;
    var password=form.password.value; if (username=="" || password=="")
    {
    alert("请输入完整!");
    return;
    } var table=document.getElementById("mytable");
    var rowcount=table.rows.length;
    table.insertRow(rowcount);
    table.rows[rowcount].insertCell(0);

    table.rows[rowcount].setAttribute("align","center");

    table.rows[rowcount].cells[0].innerHTML="<div onmouseover='changecolor(this)' onDblClick='fastupdate(this)'>"+username+"</div>";
    table.rows[rowcount].insertCell(1);
    table.rows[rowcount].cells[1].innerHTML="<div onmouseover='changecolor(this)' onDblClick='fastupdate(this)'>"+password+"</div>"; table.rows[rowcount].insertCell(2);
    table.rows[rowcount].cells[2].innerHTML="<input type='button' value='删除' onclick='del(this)'/>";
    table.rows[rowcount].cells[2].innerHTML+="<input type='button' value='更新' onclick='update(this)'/>"; form.username.value="";
    form.password.value="";
    form.username.focus();
    }

    function del(src)
    {
    var tr=src.parentNode.parentNode; var tbody=document.getElementById("mytable").firstChild;
    tbody.removeChild(tr);

    } function update(src)
    {
    var tr=src.parentNode.parentNode;
    var str=prompt("输入用户名和密码,以逗号分开!"); if (str!=null && str!="" && str!="undefined" && str.indexOf(",")>=0)
    {
    var arr=str.split(","); usernametd=tr.firstChild;
    passwordtd=tr.childNodes[1];
    usernametd.innerHTML="<div onmouseover='changecolor(this)' onDblClick='fastupdate(this)'>"+arr[0]+"</div>";
    passwordtd.innerHTML="<div onmouseover='changecolor(this)' onDblClick='fastupdate(this)'>"+arr[1]+"</div>";
    } }

    function changecolor(src)
    {
    var tr=src.parentNode.parentNode;
    if (currenttr!=null)
    {
    currenttr.style.background="#FFFFFF";
    }
    tr.style.background="#CCCCCC";
    currenttr=tr;
    }
      </script>
     </HEAD> <BODY>
      <form id="myfrom">
    用户名:<input type="text" onkeydown="if (event.keyCode==13) {password.focus();password.select()}" name="username"/><br/>
    密码:<input type="password" onkeydown="if (event.keyCode==13) btn.click();" name="password" ><br/>
    <input type="button" value="增加" name="btn" onclick="add(this.form)"/>
      </form> <div align="center">
    <table border="1" cellpadding="0" cellspacing="0" width="70%" id="mytable">
    <tr>
    <th>用户名</th>
    <th>密码</th>
    <th>操作</th>
    </tr>
    </table>
    </div>
     </BODY>
    </HTML>
      

  6.   

    饿...增加删除的问题解决了.但是如何插入到页面的元素中出大问题了
    插到网页的任何元素都会IE  doucument出错终止程序.只有插在body内不会出错.
    找了些资料说是初始化未完成就被自定义转了值.
    但是init方法不放在元素内的话那这就没意义了啊.
    有谁对底层了解一点的吗?