IE11 innerHTML奇怪的行为

Question

我在IE11中对element.innerHTML有非常奇怪的行为.

正如您在那里看到的那样:http://pe281.s3.amazonaws.com/index.html,某些riotjs表达式未被评估.

我已将其追踪到两件事:
- 欧元符号在它之上.它被编码为€,但我和\u20ACor 有相同的行为€.它适用于货币符号范围内的所有字符以及其他一些范围.删除或使用标准字符不会导致问题.
- riotjs创建自定义标记和模板的方式.基本上这样做:

var html = "{reward.amount.toLocaleString()}<span>&#8364;</span>{moment(expiracyDate).format('DD/MM/YYYY')}";
var e = document.createElement('div');
e.innerHTML = html;

在结果e节点中,e.childNodes返回以下数组:

[0]: {reward.amount.toLocaleString()}
[1]: <span>€</span>
[2]: {
[3]: moment(expiracyDate).format('DD/MM/YYYY')}

显然,节点2和3应该只有一个.让他们分裂让暴乱无法识别要评估的表达,因此问题.

但还有更多:问题不一致,例如无法在小提琴上复制:https://jsfiddle.net/5wg3zxk5/4/,其中html字符串被正确解析.

所以我想我的问题是一些特定字符如何改变element.innerHTML解析其输入的方式？怎么解决？

Answer 1

我认为应该是这样的：

var html = {reward.amount.toLocaleString()}  + "&euro;<br>" +{moment(expiracyDate).format('DD/MM/YYYY')} + " <br>";
var e = document.createElement('div');
e.innerHTML = html;

我从引号中删除的内容似乎是变量或其他内容，而不是字符串，因此它不应该在引号中。