Question

The following code is working fine in Firefox but IE is throwing an error:

Unexcepted Runtime Error on Line: 41, Char: 3.

Why can't IE handle this code? What do I need to do to fix it?

 <script>
 function addComparison()
 {
    var tableTR = document.getElementById('comparisons');
    if(tableTR!=null)
    {
        var td2Add = "<td id='comp_2' valign='top' align='left' style='border-right: 1px solid black'>ADDED</td>";
        alert(td2Add);
        tableTR.innerHTML += td2Add; //LINE 41, the line IE8 errors on!
    }
 }
 </script>

The function is called by clicking this link:

 <a href='javascript:addComparison();'>Add Comparison</a>

The element its attempting to update:

 <table>
   <tr id='comparisons' valign='top' align='left'></tr>
 </table>
Was it helpful?

Solution

'innerHTML' on 'tr' elements is readOnly in IE

The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.

source: http://msdn.microsoft.com/en-us/library/ms533897(VS.85).aspx

You can however create a whole new table using innerHTML (probably not what you want to do) or use document.createElement and appendChild/replaceChild etc to get your intended results.

Hope this helps!

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top