JavaScript 字符串轮换和DOM操作技巧

<div id=”testdiv1”>

  <input type=”button” value=”点击测试” onclick=”testFunction(‘testdiv1’)”>

  …..相当多的HTML代码.与以上类似

</div>

<div id=”testdiv2”>

  <input type=”button” value=”点击测试” onclick=”testFunction(‘testdiv2’)”>

  …..相当多的HTML代码.与以上类似

</div>

var gzjl = document.getElementById("jyxlDiv");//拿到被复制的对象

var gzcon = document.createElement("div");//创建一个新的DIV

gzcon.setAttribute("id","jyjl" + jyxl );//为新的DIV设置值

gzjl.appendChild(gzcon);//把新的DIV加在原来DIV的后面

var gzconId = document.getElementById("jyjl" + jyxl);//取得新创建的DIV对象

//拼装相关的内容

var tarcon = document.getElementById("jyjl0" ).innerHTML ;//拿到要复制的对象里面的HTML代码

//对有关的内容进行拼装

var reg = /(id=\w+|'\w+)(\d{1})/g ;//匹配的正则表达式,这里用到了正则的分组

tarcon = tarcon.replace(reg,"$1"+jyxl);// 这是关键,用到了字符串的replace方法,两个参数,1,正则表达式,2,要替换的内容.$1指的是正则里面的第一组,以此类推

gzconId.innerHTML = tarcon;

var tab = document.getElementById("tabcontext");//拿到当前页面的表格对象

//判断用户点击的是哪一行

var temp = 0 ;

for(i = 0 ; i < tab.rows.length ; i ++ )

{

         if(tab.rows[i] == curr )

         {

temp = i ;

         }

}

//处理点击当前的样式

tab.rows[temp].cells[0].className = "paddingt8" ; //为样式赋值

tab.rows[temp].cells[1].className = "paddingt8" ;

tab.rows[temp].cells[2].className = "textin12 paddingt8" ;

tab.rows[temp].cells[3].className = "textin12 paddingt8" ;

tab.rows[temp].cells[4].className = "textin12 paddingt8" ;

//要添加的文本

var addcontext = document.getElementById("addcontext");

if(addcontext != null )

{

         //表明已经添加过了

         addcontext.parentNode.removeChild(addcontext);//节点

         return false ;

}

//添加新行的方法

var tr = tab.insertRow(temp + 1 );//在点击的当前行的下一行添加内容,添加行的方法,

tr.className = "tr_hover" ;

tr.id = "addcontext" ;

//添加单元格

tr.insertCell(0);//添加单元格

tr.cells[0].className = "table_trboth paddingt8" ;

tr.cells[0].align = "center" ;

tr.insertCell(1);

tr.cells[1].colSpan = 4 ;

tr.cells[1].className = "table_trboth paddingt8" ;

tr.cells[1].innerHTML = "<p class='frihgt marginr8 margint9'>蒂塔万提斯sfdasf</p>";