Ext JS入门指南：Window示例与TabPanel实践

本文档主要介绍了作者对Ext JS这门JavaScript框架的学习历程和经验分享，特别是对于初学者而言非常有价值的入门书籍推荐。Ext JS以其陡峭的学习曲线著称，但通过实际操作和理解，作者成功地掌握了其核心概念。 首先，作者从创建第一个Ext JS窗口（Window）入手，利用onReady函数加载并实例化一个新的Window对象。重点在于`el`属性，它代表了HTML元素，允许开发者将自定义的HTML元素与Ext JS组件关联起来，从而实现页面设计与Ext JS样式相结合。例如，通过`layout='fit'`属性，窗口能够适应其容器的大小，`closeAction='hide'`则设置了窗口可隐藏关闭。`show(container)`方法用于指定渲染位置，此处是将窗体添加到页面主体元素中。 接下来，作者提到如何创建一个包含标题栏的简单窗口，并强调了使用自己的div来构建Ext JS样式组件的重要性。这有助于理解框架如何将普通HTML元素转化为功能丰富的用户界面组件。 然后，作者介绍了TabPanel的使用，这是一个在日常开发中可能不常用的Ext JS组件。通过`Ext.onReady`创建TabPanel实例，并通过`applyTo`方法将其应用到自定义的HTML `div`上，如`my-tabs`。`activeTab`属性设置初始激活的选项卡，`deferredRender`控制何时渲染，而`autoTabs`则自动将内部的div转换为Tab。 总结来说，这篇分享详细阐述了如何通过实践开始学习Ext JS，从基础的窗口组件创建，到高级的TabPanel使用，为想要掌握Ext JS的读者提供了一条清晰的学习路径。通过这些实例，读者不仅可以理解框架的工作原理，还能逐渐熟悉其核心API和组件的使用方式。对于初学者来说，这是一本值得推荐的入门书籍，有助于降低学习曲线并快速上手。