如何写出优雅的代码？

everything is null
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

javascript控制表格的问题

Posted on 2005-10-04 21:48  灰色  阅读(82)  评论(0)    收藏  举报
我现在需要将页面上的所有的东西都格式化为176PX，可是我用下面的代码嵌套的表格不能完全显示，希望有人指点一二。谢谢。


<HTML>
<HEAD>
<TITLE>setWidth</TITLE>

<SCRIPT TYPE="text/javascript">
<!--
function setWidth(){
            var collTable=document.getElementsByTagName("table");
            for (i=0;i<collTable.length;i++)
            {
                    if(collTable[i].parentElement.tagName=='table')
                    {
                    }
                    else
                    {                
                       collTable[i].style.width='176px';
                       collTable[i].style.tableLayout='fixed';
                       collTable[i].style.wordBreak='break-all';
                       collTable[i].style.backgroundColor= '#ff0000';
                    }
            }

}
//-->
</SCRIPT>
</HEAD>
<body onload="if(document.getElementById) setWidth()">

<Table border="1" id="tbl">
  <tr>
    <td width="25%">专注于web开发技术专注于web开发技术</td>
    <td width="25%">专注于web开发技术专注于web开发技术</td>
    <td width="25%">专注于web开发技术专注于web开发技术</td>
    <td width="25%">专注于web开发技术专注于web开发技术</td>
  </tr>
  <tr>
    <td width="25%">
      <table border="1" width="100%">
        <tr>
          <td width="33%">ddd</td>
          <td width="33%">ddd</td>
          <td width="34%">dd</td>
        </tr>
        <tr>
          <td width="33%">dd</td>
          <td width="33%">dd</td>
          <td width="34%">dd</td>
        </tr>
        <tr>
          <td width="33%">ddd</td>
          <td width="33%">dd</td>
          <td width="34%">dd</td>
        </tr>
      </table>
    </td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
</table>

<table border="1" width="100%">
  <tr>
    <td width="20%">asdf</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
  </tr>
  <tr>
    <td width="20%">asdf</td>
    <td width="20%">dddddddddddddddddddccccccccccccccccc777777777777ddddddddddddddddddddd</td>
    <td width="20%">dddddddddddddddddddddddddddddd</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
  </tr>
  <tr>
    <td width="20%">　</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
    <td width="20%">　</td>
  </tr>
</table>

</BODY>
</HTML>
已经解决了，修改后的如下所示：
 for (i=0;i<collTable.length;i++)
            {
                    if(collTable[i].parentElement.tagName=='table')
                    {
                    }
                    else
                    {                
                       collTable[i].style.width='176px';
                       collTable[i].style.tableLayout='fixed';
                       collTable[i].style.wordBreak='break-all';
                       collTable[i].style.backgroundColor= '#ff0000';
                    }
            }
是我自己马虎了，不过这段代码在smartphone的Pocket IE上执行似乎有问题，希望有smartphone机器的朋友帮忙看看，能不能实现页面宽度的限制，就像opera一样。谢谢。