javascript - js设置innerhtml - innerHTML删除Internet Explorer中的属性引号




js获取innerhtml (5)

当你在IE中获得一个DOM节点的innerHTML时,如果属性值中没有空格,那么IE会删除它周围的引号,如下所示:

<html>
    <head>
        <title></title>
    </head>
    <body>
        <div id="div1"><div id="div2"></div></div>
        <script type="text/javascript">
            alert(document.getElementById("div1").innerHTML);
        </script>
    </body>
</html>

在IE中,警报将显示为:

<DIV id=div2></DIV>

这是一个问题,因为我将它传递给需要有效的XHTML的处理器,并且必须引用所有的属性值。 有没有人知道一个简单的方法来解决在IE中的这种行为?


一年前,我遇到了同样的问题,用InnerXHTML解决了这个问题 ,这个脚本比我更聪明。 它基本上是一个返回标准标记的innerHTML的自定义版本。


你用jQuery试过吗?

alert($('#div1').html());

我已经测试过了,除了那些被连字符的,比如class = day-month-title之外,它对大多数属性都有效。 它会忽略这些属性,不会引用它们。


这个问题有一个快速和肮脏的解决方法。 我在使用jQuery模板时使用了它。 只需为该属性的值添加尾随空格即可。 当然,这对于在示例中使用的id没有多大意义,所以这里是另一个涉及jQuery和jQuery模板的示例:

http://jsfiddle.net/amamaenko/dW7Wh/5/

注意行<input value="${x} "/>没有它的尾部空格,这个例子在IE上不起作用。


IE的innerHTML确实很烦人。 我为它写了这个函数,这可能是有帮助的? 它引用属性并将标记名设置为小写。 顺便说一下,为了使它更恼人,IE的innerHTML不会删除非标准属性的引号。

基于注释编辑现在函数处理属性值中的更多字符,并可选地将属性值转换为小写字母。 这个函数现在看起来更丑陋了〜)。 如果要添加或删除等式中的字符,请编辑[a-zA-Z\.\:\[\]_\(\)\&\$\%#\@\!0-9]+[?\s+|?>]部分正则表达式。

function ieInnerHTML(obj, convertToLowerCase) {
    var zz = obj.innerHTML ? String(obj.innerHTML) : obj
       ,z  = zz.match(/(<.+[^>])/g);    

    if (z) {
     for ( var i=0;i<z.length;(i=i+1) ){
      var y
         ,zSaved = z[i]
         ,attrRE = /\=[a-zA-Z\.\:\[\]_\(\)\&\$\%#\@\!0-9\/]+[?\s+|?>]/g
      ;

      z[i] = z[i]
              .replace(/([<|<\/].+?\w+).+[^>]/,
                 function(a){return a.toLowerCase();
               });
      y = z[i].match(attrRE);

      if (y){
        var j   = 0
           ,len = y.length
        while(j<len){
          var replaceRE = 
               /(\=)([a-zA-Z\.\:\[\]_\(\)\&\$\%#\@\!0-9\/]+)?([\s+|?>])/g
             ,replacer  = function(){
                  var args = Array.prototype.slice.call(arguments);
                  return '="'+(convertToLowerCase 
                          ? args[2].toLowerCase() 
                          : args[2])+'"'+args[3];
                };
          z[i] = z[i].replace(y[j],y[j].replace(replaceRE,replacer));
          j+=1;
        }
       }
       zz = zz.replace(zSaved,z[i]);
     }
   }
  return zz;
}

应该工作的示例键值对

data-mydata=return[somevalue] => data-mydata="return[somevalue]"
id=DEBUGGED:true => id="DEBUGGED:true" (or id="debugged:true" if you use the convertToLowerCase parameter)
someAttribute=Any.Thing.Goes => someAttribute="Any.Thing.Goes"




innerhtml