CSSルールは、

Question

より多く

<table> 
<tbody> 
<tr class="positive"> 
<td class="happy">12</td> 
<td class="happy">7</td> 
<td class="happy">69</td> 
</tr> 
</tbody> 
</table> 

▲これは起源のhtmlコードです。

td.happy(@>10) {color:red;} 
td.happy(@>50) {color:blue;} 

▲これは私が望むCSSコードです。特定の数よりも多い数（10、50）

i'vは、Javaスクリプト試みたが、それが働いていたとき

iはCSSスタイルを適用したいと思います（想像）、しかし、私は、ウェブサイトを作りたいですできるだけhtmlとCSSを使用するだけです。

タグにあるテキストの番号を選択する方法はありますか？

Answer 1

あなたは純粋なCSSで、あなたはjqueryのを助けなければならないことはできません。

$(document).ready(function(){ 
 
    $('tr.positive td.happy').each(function(){ 
 
    number = parseFloat($(this).text()); 
 
    if(number > 10) 
 
     $(this).addClass('greater10'); 
 
    if(number > 50) 
 
     $(this).addClass('greater50'); 
 
    }) 
 
})

td { 
 
    border: 1px solid #000; 
 
} 
 

 
.greater10 { 
 
    color: red; 
 
} 
 

 
.greater50 { 
 
    color: blue; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<table> 
 
    <tbody> 
 
    <tr class="positive"> 
 
     <td class="happy">12</td> 
 
     <td class="happy">7</td> 
 
     <td class="happy">69</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

specificationを読むと、

エレメント内の属性の名前と、エレメント内の名前付き属性の値とを照合することができます。あなたができる唯一のコントロールは、タグがemptyの場合です。

Answer 3

jsページ全体を避けようとしている場合は、HTMLにjsを埋め込むことを検討してください。