js实现表元下角标单位字体设置

需求：在很多场景下，需要为数值设置单位，往往为了页面美观，单位可能和数值字体的颜色大小均不同，下面我们就实现了该功能

效果图：

实现脚本：

/**

cellId:需要设置后缀的表元ID；例如GRID1.A1

unit:需要设置的下角标后缀

subFontSize:下角标字号

fontColor:下角标字体颜色

fontWeight,具体选项参数如下：

normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置

bold : 粗体。相当于number为700。也相当于b对象的作用

bolder : IE5+　特粗体

lighter : IE5+　细体

**/

function setSub(cellId,unit,subFontSize,fontColor,fontWeight){

var content=document.getElementById(cellId).textContent;

document.getElementById(cellId).innerHTML=content+"<font style="font-size:"+subFontSize+"px;color:"+fontColor+";font-weight:"+fontWeight+"">"+unit+"</font>";

}

setSub("GRID1.A1","min",12,"#888845","bold");

 

如果需要让下角标字体和表元同色，修改成如下内容即可：

function setSub(cellId,unit,subFontSize,fontWeight){

var content=document.getElementById(cellId).textContent;

document.getElementById(cellId).innerHTML=content+"<font style="font-size:"+subFontSize+"px;font-weight:"+fontWeight+"">"+unit+"</font>";

}

setSub("GRID1.A1","min",12,"bold");