需求:比较税前薪资是否在薪资范围内,超过范围则薪资输出变红色。
vo里面加了变量redFlag用于判断一条记录是否超过范围,是否变红。但是在jsp页面中由于封装的标签,修改css没有用。
想到用js动态改变颜色。但是tb:gridColumn标签只能加styleClass属性
<!-- added by wang.yanlong 2015-04-17 超过税前薪酬上限变红1红0黑-->
<logic:equal value="1" name="stdHeadcountDetailVO" property="redFlag">
<tb:gridColumn property="salaryBefore" label="税前薪酬" styleClass="dragon" />
</logic:equal>
<logic:equal value="0" name="stdHeadcountDetailVO" property="redFlag">
<tb:gridColumn property="salaryBefore" label="税前薪酬" />
</logic:equal>
<!-- end -->
渲染的html是:<td class="dragon "><span class="view" style="display:block;">2800</span></td>
如何通过class属性得到对象再改变里面span标签的style属性呢。
1.通过class属性得到对象。
2.找到span对象,改变style属性。
//js变红added by wang.yanlong 2015-04-17,
//这个方法 第一个参数 需要传入 获取class类的父节点
//第二个参数就是你传入的class名字
//返回的是所有class属性同名的对象数组。
function getByClass(oParent, sClass)
{
var aEle=oParent.getElementsByTagName('*');
var aResult=[];
var re=new RegExp('\\b'+sClass+'\\b', 'i');
var i=0;
for(i=0;i<aEle.length;i++)
{
if(re.test(aEle[i].className))
{
aResult.push(aEle[i]);
}
}
return aResult;
}
var wz=getByClass(document,'dragon');
//遍历所有class="dragon"的td对象。找到第一个子节点span,改变style的颜色为red.
for(var i = 0 ; i < wz.length; i++){
alert(wz[i].firstChild.style.color);
wz[i].firstChild.style.color='red';
}
//end
相关推荐
一个基于原生js而封装的颜色选择器插件。 安装与使用 安装 npm install ew-color-picker --save-dev 引入 [removed][removed] 颜色选择器插件如下: //默认配置 var color = new ewColorPicker('.demo'); 或 var...
使用JavaScript访问DOM的一个重大问题是,此过程需要一种通过元素类名称来选择类的类函数,对DOMContentReady,这种类函数的缺失导致开发人员需要自己编写自定义脚本业执行上述任务,许多这个类脚本都是围绕着...
本文实例讲述了JS中getElementsByClassName与classList兼容性问题解决方案。分享给大家供大家参考,具体如下: document(element).getElementsByClassName(classNames:classString); HTML5新添加了这个方法,这个...
1)document.getElementById(id);通过对象的属性id来获取; 2)element.getElementByTagName(tag);通过标签名来获取; 3)element.getElementByClassName(class);通过属性类名来获取; 2:属性的set和get方法. 1)...
document.getElementByClassName 帮手 防抖和油门 睡觉 objectToArray和arrayToObject 2个对象的差异 记忆功能 数据结构 堆实施LRCache 队列 单链表 双链表 演算法 插入排序 选择排序 气泡排序 快速排序 合并...
chainons-js 用于小部件的一些有用的 javascript 片段列表(Affinitad-Twenga 项目) 随机百分比.js 哈萨德() 格式价格.js 删除十进制() addDecimals() 货币开关() DOMsibling.js 下一个兄弟姐妹() 上一个...
用对选择器 在jQuery中,可以用多种选择器,选择同一个网页元素。每种选择器的性能是不一样的,应该了解它们的性能差异 ...Firefox、Safari、Chrome、Opera浏览器,都有原生方法getElementByClassName
用对选择器 在jQuery中,可以用多种选择器,选择同一个网页元素。每种选择器的性能是不一样的,应该了解它们的性能差异 ...Firefox、Safari、Chrome、Opera浏览器,都有原生方法getElementByClassName
整理的10大JavaScript函数,prototype的$函数,隐藏、显示元素函数,通过className获取DOM元素函数
自述文件- 如何运行 从下载整个目录并打开 Index.html 为主页和打开 views/pizza.html 为披萨页面*对 index.html 进行优化 *-缩小 HTML、JS 和 CSS *-将谷歌字体异步到 javascript 字体加载器中 *-异步谷歌分析 *-...
getElementByClassName() parseJSON() stringifyJSON() 某些代码可能是用ES6编写的,可能需要进行编译才能进行测试。 要求 在Chrome chrome://flags/#enable-javascript-harmony.上启用了ES6 chrome://...