解决错误：“废弃 document 元素之后的内容”——HTML5新特性，局部样式表
浏览数：18 /
时间：2015年06月09日
最近正在学习angularjs，不过本文和angularjs没多大关系。在学习使用route和ng-view使用模版之后，发现view装载之后，firefox都会报个错误“废弃 document 元素之后的内容”，虽然页面正常运行，不过总是看着别扭:(。
仔细查看后，发现报错之处指向了样式表标签style的结束处，这才反应过来：原来是完整html页面，样式表在head标签之中没有问题，可是现在这些各个view模版自己使用的一些样式就直接写到了模版中，因此不在整个页面的Head之中，html协议是不支持的！虽然这些style都是很简单的，局部功能专用的，但是以前如果想要解决此问题，都只能是建立一个app的整个style文件，使用class的方式解决，需要起个每个功能的样式专用的名字，再给每个元素引用，可是这样一来不但麻烦，而且麻烦！因为不能给元素写通用的样式了！很不甘心，就去W3School，仔细研究了一下html5的文档，发现HTML5已经支持局部的样式表了^_^。不过有两点要求，第一需要放在一个父元素之内，第二添加属性scoped。改造好的模版如下：
<div id="view-xxx"> <style scoped="scoped"> A{} thead tr{} tbody tr{} </style> ... </div><!-- end of view -->
重新载入看看，完美解决！
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
