Custom Selector
Custom Selector
Custom Selector
//Custom Selector
//match to hoboNumber and number width px|em|ex|pt|pc|mm|cm|in and '-'
jQuery.extend(jQuery.expr[":"], {
hoboNumber : function(a,i,m){
var b = Number(
(a.textContent||a.innerText||jQuery(a).text()||"")
.replace(/,|^-$|(px|em|ex|pt|pc|mm|cm|in)$/g,'')
);
return !isNaN(b);
}
});
#test1
| Id | Name | Type | Unit | Memo |
|---|
| 1 | アイ | さる | 1.2em | 100,000 |
| 2 | 1クロ | カメ | 100px | 100,000 |
| 3 | タマ | ねこ | - | 80,000 |
| 4 | チヤーくん | いぬ | 12 | 5,000,000 |
#test2 (数値や10pxなどの単位付き数値を右揃え で 文字色赤)
| Id | Name | Type | Unit | Memo |
|---|
| 1 | アイ | さる | 1.2em | 100,000 |
| 2 | 1クロ | カメ | 100px | 100,000 |
| 3 | タマ | ねこ | - | 80,000 |
| 4 | チヤーくん | いぬ | 12 | 5,000,000 |
#test1
<table id="test1" border="1">
<tr><th>Id</th><th>Name</th><th>Type</th><th>Unit</th><th>Memo</th></tr>
<tr><td>1</td><td>アイ</td><td>さる</td><td>1.2em</td><td>100,000</td></tr>
<tr><td>2</td><td>1クロ</td><td>カメ</td><td>100px</td><td>100,000</td></tr>
<tr><td>3</td><td>タマ</td><td>ねこ</td><td>-</td><td>80,000</td></tr>
<tr><td>4</td><td>チヤーくん</td><td>いぬ</td><td>12</td><td>5,000,000</td></tr>
</table>
#test2
<table id="test2" border="1">
<tr><th>Id</th><th>Name</th><th>Type</th><th>Unit</th><th>Memo</th></tr>
<tr><td>1</td><td>アイ</td><td>さる</td><td>1.2em</td><td>100,000</td></tr>
<tr><td>2</td><td>1クロ</td><td>カメ</td><td>100px</td><td>100,000</td></tr>
<tr><td>3</td><td>タマ</td><td>ねこ</td><td>-</td><td>80,000</td></tr>
<tr><td>4</td><td>チヤーくん</td><td>いぬ</td><td>12</td><td>5,000,000</td></tr>
</table>
<script type=text/javascript>
jQuery(function($){
$("td:hoboNumber","#test2")
.css("text-align","right")
.css("color","red")
})
</script>