使用Sencha ExtJS自定义现有网站或做一个混搭 [英] Using Sencha ExtJS to customise an existing website or do a mashup
问题描述
我正在使用ExtJS 4.2.1添加自定义到我没有设计控制的网站。您可以将其视为将ExtJS组件添加到另一个页面作为mashup。
问题是当ExtJS启动时会添加CSS类，例如 x-body ，到< body> DOM的元素，这会影响页面上的其他内容。我需要能够阻止它执行此操作，同时仍然允许它在ExtJS容器上生效。
我知道我可以使用IFrame来包含我的ExtJS自定义并将其与页面的DOM隔离，但是我发现使用IFrames的性能有问题，甚至在Firefox和IE中出现问题，所以需要一个不同的解决方案。
在ExtJS 4.0.2中，如果您设置 scopeResetCSS：true 魔术发生，但在ExtJS 4.2.1中找不到该选项。 p>
我想你有几个丑陋的选择：
- 从ExtJS样式表中删除样式（一个漫长而无聊的工作）
- 使用Ext.Element和removeClass函数从每个元素手动删除类 http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.dom。 Element-method-removeCls
I'm using ExtJS 4.2.1 to add customizations to a web site over which I have no design control. You could consider this to be like adding ExtJS components to another page as a mashup.
The problem is that when ExtJS starts up it adds CSS classes, such as x-body, to the <body> element of the DOM and this affects everything else on the page. I need to be able to stop it doing this while still allowing it to take effect on the ExtJS containers.
I know that I can use an IFrame to contain my ExtJS customization and isolate it from the page's DOM, but I found problems with performance with IFrames, and even rendering problems in Firefox and IE so need a different solution.
In ExtJS 4.0.2 if you set scopeResetCSS:true the magic happens, but in ExtJS 4.2.1 I can't found the option.
I guess you have a couple ugly options:
- Remove the styles from ExtJS stylesheet (a long and boring work)
- Use Ext.Element and removeClass function to manually remove the class from each element http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.dom.Element-method-removeCls
这篇关于使用Sencha ExtJS自定义现有网站或做一个混搭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
