如何通过Component ID修改ExtJS组件及子元素的CSS样式？

让我来帮你解决这个弹窗组件样式修改的问题，结合Ext JS的特性给你梳理可行的方案：

首先要明确，在Ext JS中操作组件时，得用正确的API方法，你之前的尝试有些语法或用法不对，这里给你修正并说明：

正确的组件获取与样式操作示例 #

// 先获取目标弹窗组件（注意：如果组件ID是动态生成带后缀的，比如你示例里的stakeholderAddUserWindow-1502，要确保拿到的是正确的组件ID）
var popupWin = Ext.getCmp('stakeholderAddUserWindow');

// 修改弹窗高度：用setHeight方法，而非update
popupWin.setHeight(1900);
// 记得更新布局，确保尺寸生效
popupWin.updateLayout();

// 添加自定义CSS类：这个方法是对的，但要确保你的CSS里已经定义了.newclass的样式，且代码在组件渲染完成后执行
popupWin.addCls('newclass');

// 设置容器背景色：需要先获取组件对应的DOM元素，再调用setStyle
popupWin.getEl().setStyle('background-color', '#5E99CC');

你之前尝试的问题说明 #

• update({height: 1900})：update方法主要用于更新组件的内容（比如HTML文本），修改尺寸应该用setHeight或直接修改组件配置后调用updateLayout。
• 直接赋值style: 'xxx'：Ext组件不能直接这样修改样式，必须通过setStyle方法或操作DOM元素实现。
• update({style: 'xxx'})：同样，update不适合用来设置样式，这不是它的设计用途。

你想用全局选择器修改子元素样式无效，主要是因为选择器不够精准，且没有利用Ext JS自带的DOM元素查找方法，这里给你两种可靠的方案：

方案1：通过组件DOM元素精准查找子元素 #

既然已经拿到了弹窗组件，直接在它的DOM范围内查找子元素，比全局选择器更可靠，不会误改其他弹窗：

var popupWin = Ext.getCmp('stakeholderAddUserWindow');
var winRootEl = popupWin.getEl(); // 获取弹窗的根DOM元素

// 给header设置样式
winRootEl.down('.x-window-header').setStyle('background-color', 'blue');
// 给body设置样式（这正是你需要的）
winRootEl.down('.x-window-body').setStyle('background-color', '#f5f5f5');
// 给footer设置样式
winRootEl.down('.x-window-footer').setStyle('background-color', '#eee');

这里的down是Ext.Element的方法，只会在当前元素的后代里查找匹配的元素，精准度很高。

方案2：修复你之前的Ext.query写法 #

如果你坚持用全局选择器，需要注意Ext.query返回的是DOM元素数组，不能直接用Ext.get包裹，得用Ext.select处理数组，或者取数组第一个元素：

// 方法A：用Ext.select处理所有匹配元素
Ext.select('.x-window#stakeholderAddUserWindow-1502 > .x-window-header').setStyle('background', 'blue');
// 方法B：取数组第一个元素（只修改第一个匹配的元素）
Ext.get(Ext.query('.x-window#stakeholderAddUserWindow-1502 > .x-window-header')[0]).setStyle('background', 'blue');

注意这里给选择器加上了弹窗的ID，避免影响页面上其他弹窗。

关键提醒 #

所有样式修改的代码，都要确保在组件渲染完成后执行，比如绑定到组件的afterrender事件：

Ext.getCmp('stakeholderAddUserWindow').on('afterrender', function(win) {
    // 在这里执行所有样式修改逻辑
    win.getEl().down('.x-window-body').setStyle('background-color', '#f5f5f5');
});

内容的提问来源于stack exchange，提问作者YOGEESH