js 动态插入表格设置样式 js设置样式

发表于 2010 年 08 月 23 日 由 搜集者 Js代码 var mytable = document.getElementById(“propertyTable”);   var row = mytable.insertRow();   

方法一：设置css class方式，如下，“table01-td01″为一css class样式

Js代码 var mytd= row.insertCell();   mytd.className=”table01-td01″;  

方法二：直接设置style属性，如下

Js代码  row .style.backgroundColor=”#FFFFFF”  ；//设置行的背景色       td=row .insertCell();         //添加单元格   td.style.cssText=”BORDER-BOTTOM:   #4a75ce   1px   solid”;     //设置单元格的样式     td.innerHTML=”<input name=button type=button   />”;      //添加td中的内容

<script type="text/javascript">    function findPosX(obj) {  var curleft = 0;    if (obj.offsetParent) { //返回父类元素，大多说offsetParent返回body     while (obj.offsetParent) {//遍历所有父类元素      curleft += obj.offsetLeft;//当前元素的左边距      obj = obj.offsetParent;             }  } else if (obj.x) curleft += obj.x;  return curleft;  }    function findPosY(obj) {  var curtop = 0;    if (obj.offsetParent) {     while (obj.offsetParent) {        curtop += obj.offsetTop;      obj = obj.offsetParent;     }  } else if (obj.y) curtop += obj.y;  return curtop;  }  function showdiv(vart,obj,weekdiv,theme,endtime,status,endtime)  {   //alert(vart)   //var test = $(obj).parent().parent();   //alert(findPosY(obj.parentElement.parentElement))   //alert(test.outerHTML)   //alert($(obj).parent().parent().attr("offsetHeight"))      var   ccell=document.getElementById("showtable").getElementsByTagName('tr')[1].getElementsByTagName('td')[0];       //var   ccellz=document.getElementById("showtable").getElementsByTagName('tr')[1].getElementsByTagName('td')[5];    //alert(findPosX(ccellz)+45-);   //alert();   //status=status.replace("'","@").replace("/","#").replace(">","*").replace("<","&").replace(" ","");   //status=status.replace("'","w").replace("/","u").replace(">","v").replace("<","x").replace(" ","");      status = status.replace(/w/g, "'").replace(/u/g, "/").replace(/v/g, ">").replace(/x/g, "<").replace(/k/g, " ");    endtime=endtime.replace(/w/g, "-");   //endtime=endtime.replace("-","w");    //var tempstatus="";        //endtime=endtime.replace("@","-");    //alert(status+"--"+endtime);           //var   ccell   =   document.all.tags( "table")[1].rows[1];      //alert(document.all.tags( "table")[1].tagName);   //return   //alert(ccell.innerHTML);       var te="weekdiv_"+weekdiv;         var tempobj= document.getElementById(te);   if(tempobj.style.display=="block")   {     // tempobj.style.left=findPosX(ccell);      //tempobj.style.top=findPosY(obj.parentElement.parentElement)+$(obj).parent().parent().attr("offsetHeight");       //tempobj.style.className="PositionObj";       var   ccellz=document.getElementById(""+(vart)+"_s");       //var   ccellz=document.getElementById("showtable").getElementsByTagName('tr')[obj.parentElement.parentElement.parentElement.rowIndex].getElementsByTagName('td')[0];       ccellz.rowSpan=ccellz.rowSpan-1;       var table = document.getElementById("showtable");        table.deleteRow(obj.parentElement.parentElement.parentElement.rowIndex+1);

       obj.src="images/jtbottom.jpg";       obj.title="查看上次记录";       tempobj.style.display="none";                        }else   {    // tempobj.style.left=findPosX(ccell);       //tempobj.style.top=findPosY(obj.parentElement.parentElement)+$(obj).parent().parent().attr("offsetHeight");      // tempobj.style.className="TableBg3";             var table = document.getElementById("showtable");       //td.parentElement.rowIndex //       //alert(obj.parentElement.parentElement.parentElement.rowIndex);      // alert("行"+vart+"出"+counttemp);            //alert(obj.parentElement.parentElement.parentElement.innerHTML);       //得到一行的第一个单元格      //var   ccellz=document.getElementById("showtable").getElementsByTagName('tr')[obj.parentElement.parentElement.parentElement.rowIndex].getElementsByTagName('td')[0];      //alert(obj.parentElement.parentElement.parentElement.rowIndex);      //alert(ccellz.rowSpan+"--"+ccellz.innerHTML);      //设置单元格跨行加1      //得到一行的第一个单元格       var   ccellz=document.getElementById(""+(vart)+"_s");       ccellz.rowSpan=ccellz.rowSpan+1;     var newRow = table.insertRow(obj.parentElement.parentElement.parentElement.rowIndex+1);//在指定位置插入行     //newRow.style.backgroundColor="blue";         // var tempi= newRow.rowIndex;    // alert(tempi);    for(var i=0;i<5;i++)    {     var cellstr=newRow.insertCell(i);     if(i==0)     {      cellstr.innerHTML = theme;      cellstr.style.cssText="text-align:center;background:url(/newworktask/request/images/TableBg2.gif) repeat-y";                      }else  if(i==1)     {      cellstr.innerHTML = endtime;      cellstr.style.cssText="text-align:center;background:url(/newworktask/request/images/TableBg2.gif) repeat-y";          }else  if(i==2)     {      cellstr.innerHTML = status;      cellstr.style.cssText="text-align:center;background:url(/newworktask/request/images/TableBg2.gif) repeat-y";          }else if(i==3)     {      cellstr.innerHTML = endtime;      cellstr.style.cssText="text-align:center;background:url(/newworktask/request/images/TableBg2.gif) repeat-y";          }else     {      cellstr.innerHTML="";      cellstr.style.cssText="text-align:center;background:url(/newworktask/request/images/TableBg2.gif) repeat-y";         }    }                  obj.src="images/jtTop.jpg";       obj.title="关闭上次记录";       tempobj.style.display="block";   }      }