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( ...
随机推荐
- 玩转Bash脚本:test測试语句
总第1篇test就是測试的意思,经常使用在流程控制语句中作为条件.以下做一下介绍. 关于真值 与其它语言不同,Bash(包含其它Shell)中,是用0表示真,非0表示假的.之所以用0表示成功,而不是1 ...
- android151 笔记
13. 14 .什么是Service以及描述下它的生命周期.Service有哪些启动方法,有什么区别,怎样停用Service? 在Service的生命周期中,被回调的方法比Activity少一些,只有 ...
- Java_spring_定时执行任务
> 版本说明 <dependencies> <dependency> <groupId>org.springframework</groupId> ...
- Laravel 5.1中 Redis 的安装配置及基本使用教程
关于Redis的介绍我们在之前Laravel 缓存配置一节中已有提及,Redis是一个开源的.基于内存的数据结构存储器,可以被用作数据库.缓存和消息代理.相较Memcached而言,支持更加丰富的数据 ...
- Helpers\PHPMailer
Helpers\PHPMailer PHPMailer is a third party class for sending emails, Full docs are available athtt ...
- [PHP] Eclipse开发PHP环境配置
首先准备好软件: 1. Apache,到这里找个最新版本 2. PHP,到这里下载 3. Eclipse IDE for Java EE Developers,到这里下载 4. DLTK Core F ...
- XML XmlDocument
1.SelectSingleNode(xPath) xPxth:xml/cam/type 一层一层递进
- linux-查看磁盘硬盘空间
du :查看文件和目录的磁盘使用情况 用法 du [选项][文件] -s:仅显示总计只列出最后加总的值 -h:以K/M/G为单位提高信息的可读性 du -sh文件名 显示文件的大小 du -sh文件 ...
- JMX笔记(一)
上篇 JMX初体验 使用HtmlAdaptorServer提供的界面实现了调用MBean,除此之外,还可以使用rmi方式连接调用MBeanServer 要连接,自然要有url:service:jmx: ...
- button倒计时可点击
.tb2 td span i{background:url(../images/numbg.png) no-repeat 0px 0;
display:inline-block;