Ext JS 的按钮样式如下:
按钮的背景色默认为应用的主色调或是灰色系, 也可以通过样式设置按钮的背景色, 详细可以参考:
Ext JS 如何设置工具栏按钮和一般按钮保持统一样式
但是, 在实际开发的场景中有可能某些按钮是不能通过Ext JS的Button 类进行创建的, 但是页面效果上又需要和Ext JS的按钮保持一致。
HTML 原生使用的是input 实现按钮, 按钮的样式如下:
很显然, 这个相对于Ext JS的按钮风格来说,就显得过于随便了。
所以, 问题就来了,如何使用HTML的元素实现Ext JS风格的按钮呢?
通过Chrome的控制台可以看到,其实Ext JS 的按钮实现就是在 a 元素里面嵌套了一些 span元素, 具体实现如下:
通过上面分析,反其道而行,通过Ext JS按钮产生的HTML元素, 可以得到类似的Ext JS按钮。于是,定义了一个获取HTML 按钮的函数,有三个参数