在我们做table页面时可能都遇到过如果为table设定了大于0的边框border，当某个单元格中的内容未填充时在IE下浏览就会出现该单元格边框不显示的现象，这严重印象了表格界面的美观。我们一般使用填充 的方法来解决这个问题，但是如果我们一个个的手工填充似乎就显得有些麻烦了，当表格内容复杂时这种修改可能会是一个极大的工程。
今天偶就想用js对这些替换进行批量的解决，首先想的的遍历单元格进行替换：
代码如下：
<script type="text/javascript">
<!--
function tdSpace(id){
var doc=document.getElementById(id).getElementsByTagName("td");
for(var i=doc.length;i>0;i--){
if(/^\s*$/g.test(doc[i-1].innerHTML)){doc[i-1].innerHTML=" ";}
}
}
window.onload=function(){
var t1=new Date().getTime();
tdSpace("test")
alert("耗时："+(new Date().getTime()-t1)+"毫秒");
}
//-->
</script>
发现在表格数据很多时速度有些慢，对1800行<tr><td></td><td>xxxx</td></tr>的行进行替换需要1.5秒之多，毕竟这里使用循环变量，效率低是很正常的，于是开始想直接对整个表格进行搜索替换而不用循环来解决，思虑几分钟之后写出了如下代码：
<script type="text/javascript">
<!--
function tdSpace(id){
var doc=document.getElementById(id);
doc.outerHTML=doc.outerHTML.replace(/(<td[^>]*>)\s*(<\/td>)/ig,"$1 $2");
}
window.onload=function(){
var t1=new Date().getTime();
tdSpace("test")
alert("耗时："+(new Date().getTime()-t1)+"毫秒");
}
//-->
</script>
执行了一下，效率的确提高了很多，和上面同样多的数据基本只需要60-70毫秒左右，这基本可以满足要求了。
考虑到只需要对ie做如上处理且在FF下不支持outerHTML的写法，再加上一个简单的浏览器判断搞定。
最终代码：
<script type="text/javascript">
<!--
function [color=#FF0000]tdSpace[/color](id){
if(!document.all)return;
var doc=document.getElementById(id);
doc.outerHTML=doc.outerHTML.replace(/(<td[^>]*>)\s*(<\/td>)/ig,"$1 $2");
}
window.onload=function(){
var t1=new Date().getTime();
tdSpace("test")
alert("耗时："+(new Date().getTime()-t1)+"毫秒");
}
//-->
</script>
在需要对表格内的单元格做空白处理时只需调用tdSpace即可，参数为table的id。演示地址：http://ajaxbbs.net/test/replaceTdSpace.html