css scope解决方案
把css代码限定在指定的HTML片段中生效 （IE8及以上、chrome）
如：
<div id="1">
<style>
p { color: red;}
</style>
<p>abcdefg</p>
</div>
css代码只在div中起作用，不影响div以外元素的样式
方案：
1、style标签添加“scoped”属性：
这种方式尚未被浏览器广泛支持
2、使用脚本方式 jquery.scoped.js https://github.com/thingsinjars/jQuery-Scoped-CSS-plugin
这种方式可以使用一个方法$.scoped()检索页面中的<style scoped>标签，把其中的css代码限定在父标签范围内
问题：
1、请问有没有人在项目中使用过如上的方案，尤其是第二种，有什么点需要注意一下？
2、有没有其它可行的实现方案？
展开
收起
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
1
条回答
写回答
-
两种都不靠谱，所以浏览器不作为标准支持。这两种方案无疑牺牲了性能，而且本身你这种写法就不合理，内联样式本身就是中不建议的写法，难以维护，样式界面不分离；如果想针对某个div设定样式，那么可以给这个div指定一个class，class命名时遵循一定的命名规范，目前，解决方案只有这样
2019-07-17 19:55:01赞同 展开评论
相关问答