昨天在家使用innerHTML时出现点小问题,调试了1个小时才明白:
代码:
看起来正确的代码,但是奇异的现象出现了,首先是页面上所有的css看起来都丢了。经过调试发现原来上述的代码变了:
神奇地把代码都补全了,造成原来的布局全没有。
当然要解决也很容易咯:
代码:
js 代码
- $('message').innerHTML+="<div id='abc'>";
- $('message').innerHTML+="<div id='abc_child'>";
- $('message').innerHTML+="<p>test</p>";
- $('message').innerHTML+="</div>";
- $('message').innerHTML+="</div>";
看起来正确的代码,但是奇异的现象出现了,首先是页面上所有的css看起来都丢了。经过调试发现原来上述的代码变了:
js 代码
- <div id='abc'></div>
- <div id='abc_child'></div>
- <p>test</p>
- <div></div>
- <div></div>
神奇地把代码都补全了,造成原来的布局全没有。
当然要解决也很容易咯:
js 代码
- var str="";
- str+="<div id='abc'>";
- str+="<div id='abc_child'>";
- str+="<p>test</p>";
- str+="</div>";
- str+="</div>";
- $('message').innerHTML=str;