用正则判断文字里的中英文并对应设置字体
方法来自蓝色理想。整个效果就是,可以让英文和中文又不同的css,也就是不同字体不同颜色。自动判断,不用手写啥style的。但是:
<script>
var eReg=/([a-z]+)/gi
function chg(obj,face1,size1,face2,size2){
obj.style.fontFamily=face1;
obj.style.fontSize=size1;
obj.innerHTML=(obj.innerText.replace(eReg,"<font face='"+face2+"' style=font-size:"+size2+">$1</font>"))
}
chg(t,"隶书","40px","Arial","10px");
</script>
找到上面方法后,我抽空尝试了一下,这里是可以定义字体和文字大小,但不能定义字符间距。晚上回家居然找不到上面那段代码的出处,倒是意外发现另一段。分两部分,自由很多:
js部分:
<script> var tempObj=document.getElementById("divMain"); hutia(tempObj); function hutia(obj){ var re="", nn, ss; if(obj.nodeType==1){ for(var i=0;i<obj.childNodes.length;i++)hutia(obj.childNodes[i]); }else if(obj.nodeType==3){ nn=document.createElement("span"); nn.className="cn"; obj.parentNode.insertBefore(nn,obj); ss=obj.nodeValue.replace(/&/g,"&").replace(/ /g," ").replace(/</g,"<").replace(/>/g,">").replace(/\n/g,"<br>").replace(/\"/g,"""); obj.parentNode.removeChild(obj); nn.innerHTML=ss.replace(/[^\u0391-\uFFE5]+/g,hutia_en); } } function hutia_en(str){ return("<span class=\"en\">"+str+"</span>"); } </script>
css部分:
.cn { /* 这里是中文样式 */ color:red; background-color:yellow; font-size:12px; }
.en { /* 这里是英文样式 */ color:#333; background-color:white; font-size:14px; }
只要把js里的divMain改为自己需要修改的文字所在的id就行了。至于css这里,想怎么设置都行,相当自由。在wp上测试成功,但发现加了很多span,看源代码觉得发毛,还是取消在blog上的使用,放独立页面玩玩倒不错。