为什么此代码示例在IE7上不起作用。问题出在哪里?谢谢。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <title>Test</title>

        <script language="javascript" type="text/javascript">

            function initialize()
            {
                for(var i=0; i < 10; i++)
                {
                    var tab = document.getElementById("search").childNodes[0];
                    var line = document.createElement("tr");
                    var column = document.createElement("td");
                    column.appendChild(document.createTextNode("DATA"));
                    line.appendChild(column);
                    tab.appendChild(line);
                }
            }

        </script>
    </head>
    <body onload="initialize()">
        <div id="search" class="bulle"><table><tr><td></td><td align="right">X</td></tr><tr><td><table id="tableResult"><table></td><td></td></tr></table></div>
    </body>
</html>

最佳答案

在IE中,您必须将表行添加到tbody中,而不是直接添加到表中。另外,在某些浏览器中,如果标记中DIV和TABLE标记之间有空格,则div的第一个子节点将是文本节点。因此,将id移到表(或tbody元素),或使用:

function initialize() {
    var div = document.getElementById("search");
    var tbody = div.getElementsByTagName('tbody')[0];

    // create rows, cells, etc.

    tbody.appendChild(line);
}


请注意,即使标签在标记中是可选的,所有具有行的表也将具有tbody元素(即,标记中没有tbody元素,但DOM中的表将具有一个tbody元素)。

在MDN上有一个有关使用DOM表方法的教程:https://developer.mozilla.org/en/Gecko_DOM_Reference/Examples#Example_8:_Using_the_DOM_Table_Interface

关于javascript - HTML Dom操作:IE7问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/6941195/

10-12 13:15