TDに通常のテキストが含まれているテーブルがあります。TDの内容に応じてTDのスタイルを設定する(たとえば、背景色を設定する)方法はありますか?たとえば、GOの背景を緑にし、REDの背景を赤にしたい場合があります。
私はこれらを試しましたが成功しませんでした:
td[innerText='GO']
td[innerHtml='GO']
td[outerText='GO']
もちろん、TDごとに内容に応じてクラスや明示的なスタイルを設定することもできますが、それは避けたいと思います。
TDに通常のテキストが含まれているテーブルがあります。TDの内容に応じてTDのスタイルを設定する(たとえば、背景色を設定する)方法はありますか?たとえば、GOの背景を緑にし、REDの背景を赤にしたい場合があります。
私はこれらを試しましたが成功しませんでした:
td[innerText='GO']
td[innerHtml='GO']
td[outerText='GO']
もちろん、TDごとに内容に応じてクラスや明示的なスタイルを設定することもできますが、それは避けたいと思います。
td
javascriptを使用して内容を確認してから、タグのスタイルを変更する必要があります。
script.js
ファイルに関数がある場合があります。
function tdStyle(current_table) {
var tds = current_table.getElementsByTagName("td");
for (i = 0; i < tds.length; i++) {
if (tds[i].textContent == "string1" || tds[i].innerText == "string1") {
tds[i].style.backgroundColor = "green";
} else if (td_tag.textContent == "string2" || tds[i].innerHTML == "string2") {
tds[i].style.backgroundColor = "red";
} else if (td_tag.textContent == "string3" || tds[i].innerHTML == "string3") {
tds[i].style.backgroundColor = "blue";
}
}
}
table
次に、次のように、タグでこの関数を使用します。
<table onload="tdStyle(this);">
<tr><td>...</td></tr>
<tr><td>...</td></tr>
<tr><td>...</td></tr>
...
</table>
IEには後者が必要なので、tds[i].textContent
との両方で比較が行われることに注意してください。tds[i].innerText