IE11误将注释内双短横线识别为结束标签，报错求解决方案

这个问题我太熟了——IE11对HTML注释的解析有个非常顽固的老bug：它会把注释内容里连续的两个短横线--之后的字符误判为注释结束标签的一部分，哪怕这俩短横线是CSS类名的分隔符（就像你例子里的block--attribute），直接抛出"Unexpected character in comment end. Expected "-->"."的错误。

给你几个实用的解决办法，按推荐程度排序：

方案一：拆分注释，避免连续--出现在注释内 #

这是最省心的方法，不需要修改原代码的类名，只是把注释里的双短横线拆成两段，中间插一个空注释：

<!-- <div class="block-<!-- -->-attribute"></div> -->

这样原类名在实际恢复代码时还是完整的block--attribute，但IE11会把拆分后的-<!-- -->-当成普通内容，不会误判为注释结束标记。

方案二：临时替换类名中的双短横线 #

如果只是临时注释代码，不需要严格保留原类名的话，直接把--改成单短横线或者下划线这类分隔符：

<!-- <div class="block-attribute"></div> -->
<!-- 或者用下划线：<div class="block__attribute"></div> -->

这种方法简单直接，完全避开了IE11的bug触发点。

方案三：用HTML实体替换双短横线 #

把注释里的--替换成短横线的HTML实体--，这样IE11解析注释时不会把它识别为注释结束符号：

<!-- <div class="block&#45;&#45;attribute"></div> -->

注意：之后如果要恢复这段代码，记得把实体改回原来的双短横线。

方案四：针对IE的条件注释 #

利用IE特有的条件注释，让IE11直接跳过这段可能触发bug的注释内容，现代浏览器不受影响：

<!--[if !IE]> -->
<!-- 这里放你的原注释代码，IE11会忽略这段 -->
<!-- <div class="block--attribute"></div> -->
<!-- <![endif]-->

不过这种方法只适用于IE浏览器，现在IE基本被淘汰，但如果你的项目还必须兼容IE11，这也是个可行的办法。

内容的提问来源于stack exchange，提问作者Aerra