childNodesがIEとFirefoxで違う

javascript

はまった原因もメモしておきます。

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>test</title>
    <script src="prototype.js" type="text/javascript"></script>
    <script type="text/javascript">
        function show() {
            var rows = $('testRow');
            alert(rows.childNodes[1].firstChild.nodeValue);
        }
    </script>
</head>
<body>
<table>
    <tr id="testRow">
        <td>a</td>
        <td>b</td>
        <td>c</td>
        <td>d</td>
        <td>e</td>
    </tr>
</table>
<script type="text/javascript">
    show();
</script>
</body>
</html>

alert結果は、Firefoxだと「a」でIEだと「b」です。
知らないと大変です。DOMコワイです。


この違いについて、詳しくは以下のページに書いてありました。


デバッグ対象がたくさんあってalertうざい場合は、IEerBugを使ってalertのところをconsole.debug(object)とやればDOMも見られてすごい便利。