JS innerHTML Double Quotes
Posted by Kevin | Filed under HTML/CSS/JS | 2010-01-21
通过js的innerhtml来获取一个dom节点,内部的html值时,如果属性值没有空格,则ie左右版本下,都会出现标签大些,双引号丢失问题。如果属性值有空格,则标签会变成大写,引号则正常输出.看下面示例:
当属性值无空格时:
FF3.5.7(gecko/20091221)<div id="div2"></div>
IE6 弹出:<DIV id=div2></DIV>
IE7 弹出:<DIV id=div2></DIV>
IE8 弹出:<DIV id=div2></DIV>
有空格时:
FF3.5.7(gecko/20091221)<div id="div2 "></div>
IE6 弹出:<DIV id="div2 "></DIV>
IE7 弹出:<DIV id="div2 "></DIV>
IE8 弹出:<DIV id="div2 "></DIV>
产生这个BUG的原因是什么呢?
即使是jQuery里面,jquery团队的技术人员也没有解决这个问题.
提供下解决方案:
- function ieInnerHTML(obj) {
- var zz = obj.innerHTML,
- z =
- zz.match(/<\/?\w+((\s+\w+(\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/?>/g);
- if (z){
- for (var i=0;i<z.length;i++){
- var y, zSaved = z[i];
- z[i] = z[i].replace(/(<?\w+)|(<\/?\w+)\s/,
- function(a){return a.toLowerCase();});
- y = z[i].match(/\=\w+[?\s+|?>]/g);
- if (y){
- for (var j=0;j<y.length;j++){
- z[i] = z[i].replace(y[j],y[j]
- .replace(/\=(\w+)([?\s+|?>])/g,'="$1"$2'));
- }
- }
- zz = zz.replace(zSaved,z[i]);
- }
- }
- return zz;
- }
在相应的地方调用函数ieInnerHTML
- if(/*@cc_on!@*/0){
- inner_str = ieInnerHTML(obj);
- }else{
- inner_str = obj.innerHTML;
- }
原理:对IE版本进行对应的JS处理,而且相应的元素标签中不要出现非标准元素
参考资料:


2010-01-23, 11:10 AM
在IE下使用innerHTML之前,一定要用js修正一下
2010-01-23, 2:40 PM
暂时还没碰到这样的问题呢...
id="abc " 有空格这样的写法..
在精神层面上时不允许的...
2010-01-23, 4:31 PM
@Lin.x
这个问题,在IE版本里面都存在,至少到IE8还没有修正。只要用到innerHTML就会有这个问题
2010-01-24, 10:26 AM
更新速度太慢了,成月经贴咯,哈哈哈。
2010-01-24, 1:46 PM
呵呵,是更新很慢...找不到可写的,找到了自己又写不出来
2010-01-28, 10:12 AM
学习了。。。。