$.fn.textwork = function(){
var str=''
for(var i=0;i<this.text().length;i++){
str +='<span>'+this.text()[i]+'<\/span>'
}
this.html(str)
}
$('p').textwork()
$('p span').eq(0).css({
color:'red'
})
这是一个Jquary小插件，可以把在父元素内的文本块里的文字每个都添加上一个<span>标签，使文字的操控可以区别精确到一个字上。调用时就：
$('div').textwork() //文字父元素是谁，里面的div就换成谁了
忘了说了，在插件里，this就是那个父元素，并且就是Jquary的元素，不用再$(this)了，错了就。
可以加些特效的：
$.fn.textwork = function(){
var str=''
for(var i=0;i<this.text().length;i++){
str +='<span>'+this.text()[i]+'<\/span>'
}
this.html(str)
}
$('p').textwork()
$.fn.boomText = function(type){
type = type || 'rollIn'
var i= 0
showtime=setInterval(function(){
this.find('span').eq(i).addClass('animated '+type)
i++
if(i >= this.find('span').length){
clearInterval(showtime)
}
},300)
}
$('p').boomText('zoomIn')
原理就是用JS操作每个字，让动画效果写在css样式里，只要加上对应的class就可以了，这里，推荐的拿来主义的动画特效的css文件，官网.
需要先引入对应的css文件，其实跟iconfont的原理一样的。这里的动画的选择参数，就是那个type,既然动画，那单个字体的span标签的display就要改了，inline-block,可以提前在css里写好的。
