Today I encountered a problem in doing things. I tried to dynamically add multiple rows of data to a table and first defined a table:
123456 | <table><thead></head><tbody id=filelist></tbody></table> |
Then in javascript:
12345 | for(var i in entries){ ... var filetable = document.getelementbyid('filelist'); filetable.innerhtml += '<tr><td>111</td><td>222</td></tr>';} |
There is no problem in firefox, but it will be impossible to put it under ie. I asked my colleagues + searched and found that the innerhtml attributes of these elements are read-only and cannot be operated directly under ie. But there is no solution. TD's innerhtml can still be operated. The above code can be modified like this:
123456789101112 | for(var i in entries){ ... var filetable = document.getelementbyid('filelist'); var tr = document.createelement('tr'); var td1 = document.createelement('td'); td1.innerhtml = '111'; var td2 = document.createelement('td'); td2.innerhtml = '222'; tr.appendchild(td1); tr.appendchild(td2); filetable.appendchild(tr);} |
You can first use the createelement method of dom to create tr and td, then perform corresponding operations on the innerhtml of td, and finally use the appendchild method to add the created elements to the dom tree. This way it can run normally under ie. It should be noted that if your table does not have a tbody, it does this:
1 | <table id=filelist></table> |
At this time, you cannot use the appendchild method directly on the table, because the table element under ie6 does not support the appendchild method (ie8 seems to have already supported it).
Some people on the Internet have also proposed to use insertrow() and other methods to do it, but this method has problems with compatibility with different browsers (insertrow(-1) is required in firefox), so it is useless.
btw, although I had read a lot of js information consciously before, I still realized the truth. Now I am just starting to be busy and I am calm in my studies