css和jQuery ,字符串中重新定义单个字符样式背景
<table class="tb2">
<tr><td class="td1">融资登记企业<span>985</span>个</td><td class="td2">融资项目数量<span>985</span>个</td><td class="td3">融资需求金额<span>985</span>万元</td></tr>
<tr><td>完成融资企业<span>00008</span>个</td><td>完成融资数量<span>985</span>个</td><td>完成融资金额<span>985</span>万元</td></tr>
</table>
背景图.tb2 td span i{background:url(../images/numbg.png) no-repeat 0px 0; display:inline-block;
font-size:20px;color:#ff0000;font-weight:bold;font-family:Arial;line-height:30px;display:inline-block;height:28px;width:27px;text-align:center;font-style:normal}
$(".tb2 td span").each(function () {//遍历每个span元素
var str = $(this).text();
var arr = str.match(/./g); //将元素中的单个字符组成数组
var str2 = "";
for (var i = ; i < arr.length; i++) {
str2 += arr[i].replace(arr[i], "<i>" + arr[i] + "<\/i>"); //将数组元素替换,并且带有i标签
}
$(this).html(str2); //对当前元素进行新的赋值,例如将数字985替换为<i>9</i><i>8</i><i>5</i>的格式
});
最终效果

如果用背景平铺和letter-spacing,是达不到这种效果的,数字的前面和后面部分都会有一小段出现
css和jQuery ,字符串中重新定义单个字符样式背景的更多相关文章
- iOS 获取字符串中的单个字符
要取到单个字符,就要知道字符串的编码方式,这样才能够定位每个字符在内存中的位置.但是,iOS的字符串编码是不固定的,因此,需要设置一个统一的编码格式,将所有其他格式的字符串都转化为统一的格式,然后就可 ...
- 发现IE7的一个问题,不能用索引取字符串中的单个字符
如下javascript: var testValue="hello,world"; alert(testValue[]); 在IE7上运行该代码,竟然提示值为"unde ...
- JavaScript替换字符串中最后一个字符
1.问题背景 在一个输入框中,限制字符串长度为12位.利用键盘输入一个数字,会将字符串中最后一位替换,比方:111111111111.再输入一个3,会显示111111111113 2.详细实现 < ...
- C语言考题:输入一个字符串,将此字符串中特定的字符删去后, 显示新的字符串,要求用函数来完成删去字符的操作。
#include <stdio.h> #include <string.h> /*此题只需要删除单个字符,比较简单.相信大家也能做出来的.我这个也是可以实现的.只是加了两个判断 ...
- JAVA----编程列出一个字符串的全字符组合情况,原始字符串中没有重复字符
package com.pb.demo.packclass.demo1; import java.util.HashSet; /** * 编程列出一个字符串的全字符组合情况,原始字符串中没有重复字符 ...
- c# 过滤字符串中的重复字符
有字符串"a,s,d,v,a,v",如果想去除其中重复的字符,怎么做? 下面是一个方法,用Hashtable来记录唯一字符,排除重复字符,仅供参考. 1.过滤方法: public ...
- oracle中一个字符串包含另一个字符串中的所有字符
oracle中一个字符串包含另一个字符串中的所有字符 --解决监理报告中所勾选的标段信息,与该用户所管理的标段字符串不匹配的问题. select * from a where instr(a,b)&g ...
- Linux c字符串中不可打印字符转换成16进制
本文由 www.169it.com 搜集整理 如果一个C字符串中同时包含可打印和不可打印的字符,如果想将这个字符串写入文件,同时方便打开文件查看或者在控制台中打印出来不会出现乱码,那么可以将字符串中的 ...
- 三种java 去掉字符串中的重复字符函数
三种java 去掉字符串中的重复字符函数 public static void main(string[] args) { system.out.println(removerepeatedchar( ...
随机推荐
- cocos2dx 3.1从零学习(一)——入门篇(一天学会打飞机)
没办法,浏览这么高,为啥没人投票呢?朋友们,我这篇文章參加了csdn博文大赛.喜欢的来点个赞吧!点击:http://vote.blog.csdn.net/Article/Details?article ...
- as 中的反射
flash.utils包中的getDefinitionByName,getQualifiedClassName,getQualifiedSuperclassName..可以当做反射用. 1.getDe ...
- SQL语言的四大分类
以下是sql数据语言类型的关键词: 1.数据定义语言DDL create.drop.alter.truncate 2.数据查询语言DQL select 3.数据操纵语言DML insert.dele ...
- Android(java)学习笔记99:android的短信发送器研究
1.第一种可以调用系统内部的短信程序. 之前我曾经出现过一个bug就是报错: android.content.ActivityNotFoundException: No Activity found ...
- oracle10g 和oracle11g同时安装时PL/SQL连不上解决方案
oracle10g 和oracle11g同时安装的时候,PL/SQL连不上解决办法:找到两者的配置文件改成一致 oracle10g服务端和oracle11g客户端同时安装的时候,PL/SQL连不上解决 ...
- C语言有关数组的几点
动态大小数组 先来看一段代码: ; int a[n]; int i; ;i<n;i++) { a[i]=i; printf("%d\n",a[i]); } 我在声明数组a时, ...
- 显示创建一个表的SQL语句
显示创建数据库中包的语句,从而可以方便的对表的结构进行修改和复制(当然还有其他的方式) 显示表结构: 显示创建表语句: show create table tablename;
- android开发推荐书籍列表
1. <第一行android代码> 入门,简单易懂,全面. 2. << Android群英传 >> 特点:UI部分相当详细 3. <<深入理解Andr ...
- 解决c#,wpf程序带环境安装包体积太大问题
在.net开发客户端的时候,一定会遇到用户没有安装.net环境的问题,特别是现在win7,win8,win10多系统并用的时间段,很多开发者使用的是4.5的目标环境,用户却是使用win7的系统,这样势 ...
- javascript工具--控制台详解(转自 阮一峰博客)
大神这篇博客是写在2011年,主要介绍 “Firefox” 浏览器插件 “Firebug” 的操作,如今主流浏览器对控制台都已经提供了很好的支持.我自己用的最多是谷歌的 “chrome” 浏览器,下面 ...
.tb2 td span i{background:url(../images/numbg.png) no-repeat 0px 0;
display:inline-block;