所以我有一些代码可供人们剪切+将小部件粘贴到他们的网站中(类似于谷歌分析或谷歌地图插件,如果你看过那些)。
我有一个需要以某种方式设计的整个区域。 现在,我可以通过手动从对象中读取配置数据来做到这一点
var x = {idWhatever: {bg-color: red, etc....}}
或者我可以document.appendChild("style")
或者我可以内联所有的CSS(我宁愿不)。
无论发生什么事情,我都不能搞砸其他人的网页。
有关处理这个的最佳方法的任何想法?
编辑:理论上,我可以使用data-uri在同一个请求中发送CSS。
我建议你仔细选择元素类名和id,这样它们都会以你的小部件名称为前缀(比如<myWidget>_mainDiv
和.<myWidget>_headerText
)。 然后确保您的样式仅定位具有这些ID /类名的元素(或至少元素内的元素)。
然后使用此处描述的方法或使用document.appendChild("style")
方法包括样式表。 理想情况下,您希望将CSS保存在自己的文件中,或者至少在某些地方,您仍然可以像CSS那样编写和维护它。 如果你把它放在某个对象里面,或者如果你内联它,你就无法真正做到这一点。
给人两种选择:
在第一种情况下,您可能知道该怎么做。
在第二种情况下,添加有意义的类名,正如@aroth在答案中建议的那样(这样可以最大程度地降低干扰实现小部件的页面上应用的类的风险)。
它可能看起来像这样:
false
而不是styles参数,然后不应用任何样式并依赖CSS类并相信用户将自己应用样式。