我有这个 html
<tr>
<td>Test</td>
<td>324</td>
</tr>
我的默认 CSS 是text-align:left
但我想适用text-align:center
于任何<td>
包含数字的内容。
我有大约 50 个 HTML 文件,所以我无法手动添加类。
我有这个 html
<tr>
<td>Test</td>
<td>324</td>
</tr>
我的默认 CSS 是text-align:left
但我想适用text-align:center
于任何<td>
包含数字的内容。
我有大约 50 个 HTML 文件,所以我无法手动添加类。
你可以使用filter
一些正则表达式魔法:
$('td').filter(function() {
return /^\d/.test($(this).text());
}).css('text-align', 'center');
上面的正则表达式有点简单,如果你需要更精确的使用这个:
/((?!\w+[^\s]))\d+\1/
以上内容将匹配(space)123
,123(space)
但基本上只允许数字和空格,如果这是您正在寻找的。要添加更多有效字符,只需将它们像,这将使逗号也有效。123a
asd 123
[^\s,]
,
老派解决方案(效果很好):
function Trim(str){
return str.replace(/^\s+|\s+$/g,"");
}
function applyCssCustomToSomeTds(){
for(i=0;i<document.getElementsByTagName('td').length;i++){
var elementTd = document.getElementsByTagName('td')[i];
if(!isNaN(Trim(elementTd.innerHTML))){
elementTd.style.textAlign = "center";
}
}
}
$(function(){
$("td").filter(function(){
return (/^\s*\d*\.?\d+\s*$/).test(this.innerHTML);
}).css("text-align","center");
});
编辑:这是一个 jsfiddle:http: //jsfiddle.net/Avf7P/
作为通过 jquery 添加类的另一个示例,您可以查看这个fiddle。'centerMe' 类只包含您需要的文本对齐值。
$('td').each(function(){
if($.isNumeric($(this).html()))
{
$(this).addClass('centerMe');
}
});
请注意,这使用 isNumeric 可能不是您的意图。如果是这种情况,那么您需要修改它以使用其他一些解决方案中提到的正则表达式方法之一。