如何重写看不到的隐性class样式

mini3000

<div id="datagrid1" class="mini-datagrid" style="width:700px;height:280px;"
    url="../data/AjaxService.aspx?method=SearchEmployees"  idField="id" allowResize="true"
    sizeList="[20,30,50,100]" pageSize="20"
>
    <div property="columns">
        <div type="indexcolumn" ></div>
        <div field="loginname" width="120" headerAlign="center" allowSort="true">员工帐号</div>   
        <div field="name" width="120" headerAlign="center" allowSort="true">姓名</div>                           
        <div field="gender" width="100" renderer="onGenderRenderer" align="center" headerAlign="center">性别</div>
        <div field="salary" dataType="currency" currencyUnit="￥" align="right" width="100" allowSort="true">薪资</div>                                
        <div field="age" width="100" allowSort="true">年龄</div>
        <div field="createtime" width="100" headerAlign="center" dateFormat="yyyy-MM-dd" allowSort="true">创建日期</div>               
    </div>
</div>


上面的那个例子，我想修改“员工帐号”、“姓名”这些字段标题（不是字段里面的具体内容），但在JSP页面是无法看到的它具体用了什么样式，于是我通过firebug找到了 mini-grid-headerCell-inner这个class样式，我在页面通过<style type="">

            .mini-grid-headerCell-inner{
                    color: #316597;
                    font-weight: bold;
            }

</style>
可以修改成我想要的效果，但由于很多页面都有用到datagrid，如果每个页面这样写后期修改会很麻烦，所以我就想写在main.js来统一控制

$(".mini-grid-headerCell-inner").css({background: '#FFDDA0',fontWeight: 'bold'});
不过这样写没有效果

于是我想请教一下，如何通过js修改那些在页面看不到的隐性class？

factory

可以试试这样

写一个专门处理你需要的样式的css
.aa .mini-grid-headerCell-inner{
   background:red;
}

后面在你需要这个样式的表格上,设置下class
grid.setCls("aa") 加上aa就会有这个样式

mini3000

factory 发表于 2014-4-9 16:45
可以试试这样

写一个专门处理你需要的样式的css

成功了，果然强大