You all like to use innerhtml to add content, but innerhtml is different in the two camps. In retrospect, ie will kill some blank spaces in the front of the tag, and all the labels in the tag will be capitalized. The dynamically added attributes will be displayed. In some elements, it is still read-only. It was chilling to find that this thing invented by IE was finally exposed to so many defects. However, innerhtml still has a mine, which exists in the most standard Firefox.Code:
VaR newtable = document. createelement ('table'); document. body. appendchild (newtable); var newtr = document. createelement ('tr'); var rowcontent = '<TD> situ zhengmei </TD> <em> restlessdream </em> </TD>'; newtr. innerhtml = rowcontent; newtable. appendchild (newtr); alert (newtable. innerhtml) if (rowcontent. tolowercase () = newtr. innerhtml. tolowercase () {alert ("it must be as expected! ");} Else {alert (" You stepped on the thunder! ");}
<Br/> <! Doctype HTML> <br/> <HTML dir = "LTR" lang = "ZH-CN"> <br/> <pead> <br/> <meta charset = "UTF-8" /> <br/> <meta http-equiv = "X-UA-compatible" content = "Ie = 8"/> <br/> <title> force Internet Explorer 8 run by situ zhengmei </title> </P> <p> <SCRIPT type = "text/JavaScript"> </P> <p> window. onload = function () {<br/> var newtable = document. createelement ('table'); <br/> document. body. appendchild (newtable); <br/> var newtr = document. createeleme NT ('tr '); <br/> var rowcontent = '<TD> situ zhengmei </TD> <em> restlessdream </em> </TD>'; <br/> newtr. innerhtml = rowcontent; <br/> newtable. appendchild (newtr); <br/> alert (newtable. innerhtml) <br/> If (rowcontent. tolowercase () = newtr. innerhtml. tolowercase () {<br/> alert ("it must be as expected! "); <Br/>}else {<br/> alert (" you are stepping on Thunder! "); <Br/>}</P> <p> </SCRIPT> <br/> </pead> <br/> <body> </P> <p> </body> <br/> </ptml> <br/>
Run code
When we add innerhtml to the tr node, it will be parsed by Firefox:
Situ zhengmei <em> restlessdream </em>
Instead of the original:
<TD> situ zhengmei </TD> <em> restlessdream </em> </TD>
The TD tag is removed! I want to adjust the sequence of adding the DOM tree:
VaR newtable = document. createelement ('table'); document. body. appendchild (newtable); var newtr = document. createelement ('tr '); newtable. appendchild (newtr); var rowcontent = '<TD> situ zhengmei </TD> <em> restlessdream </em> </TD>'; newtr. innerhtml = rowcontent;
<Br/> <! Doctype HTML> <br/> <HTML dir = "LTR" lang = "ZH-CN"> <br/> <pead> <br/> <meta charset = "UTF-8" /> <br/> <meta http-equiv = "X-UA-compatible" content = "Ie = 8"/> <br/> <title> force Internet Explorer 8 run by situ zhengmei </title> </P> <p> <SCRIPT type = "text/JavaScript"> </P> <p> window. onload = function () {<br/> var newtable = document. createelement ('table'); <br/> document. body. appendchild (newtable); <br/> var newtr = document. createeleme NT ('tr'); <br/> newtable. appendchild (newtr); <br/> var rowcontent = '<TD> situ zhengmei </TD> <em> restlessdream </em> </TD> '; <br/> newtr. innerhtml = rowcontent; <br/> alert (newtable. innerhtml) <br/> If (rowcontent. tolowercase () = newtr. innerhtml. tolowercase () {<br/> alert ("it must be as expected! "); <Br/>}else {<br/> alert (" you are stepping on Thunder! "); <Br/>}</P> <p> </SCRIPT> <br/> </pead> <br/> <body> </P> <p> </body> <br/> </ptml> <br/>
Run code
This solves the problem of Firefox!