我有一个html表,在特定的列中,文本设置为'Y'或'N'.我想知道如果值为'N',是否可以在加载时以编程方式将文本的颜色设置为红色?
<table>
<tr>
<td>N</td>
<td>Y</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
Jar*_*ish 14
使用jQuery,很简单:
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#table_id td.y_n').each(function(){
if ($(this).text() == 'N') {
$(this).css('background-color','#f00');
}
});
});
</script>
</head>
<body>
<table id="table_id">
<tr><th>Question</th><th>Y/N?</th></tr>
<tr><td>I am me.</td><td class="y_n">Y</td></tr>
<tr><td>I am him.</td><td class="y_n">N</td></tr>
<tr><td>I am not sure.</td><td class="y_n">Y</td></tr>
<tr><td>This is a table.</td><td class="y_n">Y</td></tr>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
注意:我测试了上面的文件,它的工作原理.复制到桌面,另存为yn.html,然后在浏览器中运行.
编辑:使用纯选择器完成而不依赖于if语句...
$(document).ready(function(){
$("#table_id td.y_n:contains('N')").css('background-color','#fcc');
});
Run Code Online (Sandbox Code Playgroud)
这是跟随Tyler Holien的回答.这将是更好的方法,因为它不涉及如此多的函数调用,并且在更少的代码中更具表现力.注意:不幸的是,如果有其他内容可能包含N并且不应该被选中,请不要使用此版本,因为contains将选择其中包含N的所有文本,而不仅仅是"N"文本.
| 归档时间: |
|
| 查看次数: |
39192 次 |
| 最近记录: |