注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

樱之花

叶散的时候,你明白欢聚;花谢的时候,你明白青春.

 
 
 

日志

 
 
关于我

分类中“我的实验室”是我在日常工作中的一些知识总结,有些写的比较匆忙,可能大家在阅读时会产生困扰,后期有时间我会重新整理编辑,谢谢大家的到访,您们的支持是我前进的动力!

网易考拉推荐

有趣的表格操作(Html)  

2007-02-07 08:54:18|  分类: 网页界面 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

<html>
<head>
</head>
<script language="javascript">
function addRecord2()
{
 var _table1 = document.getElementById("tb1");
 var _table2 = document.getElementById("tb2");
 var kit = true;
 for(i=0;i<_table1.rows.length;i++)
 {
  if(_table1.rows[i].style.backgroundColor=="yellow")
  {
   for(var j=0;j<_table2.rows.length;j++)
   {
    if(_table2.rows[j].innerHTML == _table1.childNodes[0].childNodes[i].innerHTML)
    {
     kit=false;
    }
   }
   if(kit==true)
   {
    _table2.childNodes[0].appendChild(_table1.childNodes[0].childNodes[i].cloneNode(true));
    _table2.rows[_table2.rows.length-1].style.backgroundColor = "";
    
   }
  }
  kit = true;
 }
}


function addRecord()
{
 var _table1 = document.getElementById("tb1");
 var _table2 = document.getElementById("tb2");
 var kit = true;
 for(i=0;i<_table1.rows.length;i++)
 {
  if(_table1.rows[i].style.backgroundColor=="yellow")
  {
   _table2.childNodes[0].appendChild(_table1.childNodes[0].childNodes[i].cloneNode(true));
   _table2.rows[_table2.rows.length-1].style.backgroundColor = "";
   //_table1.deleteRow(i);
   _table1.rows[i].style.display="none";
   //addRecord();
  }
  kit = true;
 }
}

function delRecord()
{
 var _table1 = document.getElementById("tb1");
 var _table2 = document.getElementById("tb2");
 for(i=0;i<_table2.rows.length;i++)
 {
  if(_table2.rows[i].style.backgroundColor=="yellow")
  {
   for(var j=0;j<_table1.rows.length;j++)
   {
    if(_table1.rows[j].innerHTML == _table2.childNodes[0].childNodes[i].innerHTML)
    {
     _table1.rows[j].style.backgroundColor = "";
     _table1.rows[j].style.display = "block";
    }
   }
   _table2.deleteRow(i);
   delRecord();
  }
 } 
}
</script>
<body>
<div >
表格一
<table border=1>
<tr hand';"; = 'yellow'">
<td>test1</td>
<td>test11</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test2</td>
<td>test21</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test3</td>
<td>test31</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test4</td>
<td>test41</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test5</td>
<td>test51</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test6</td>
<td>test61</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test7</td>
<td>test71</td>
</tr>
<tr hand';"; = 'yellow'">
<td>test4</td>
<td>test41</td>
</tr>
</table>
</div>

<div >
表格二
<table border=1>
</table>
</div>
<input type="button" value="add" />
<input type="button" value="del" />
<p>
备注:<br />
1.选择表格一中的项目,点"add"可追加到表格二里,并且让选择的项目隐藏。<br />
2.选择表格二中的项目,点"del"可删除选择的项目,并且出现在表格一里。<br />
3.当鼠标单击表格中某项目时,左键选择项目,右键取消选择。<br />
4.在选择表格一中的项目时候,重复项不可追加到表格二里。
</p>
</body>
</html>

  评论这张
 
阅读(452)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017