如何：有条件地格式化a<；td>；，这是通过MySQL查询生成的，基于内容并使用PHP/JavaScript

我有一个数据库表，其中包含：

Industry risk
--------------
      A
      B
      C

$(function() {
            $("#querytable td:contains('A')").css('background-color','#C0504D'),
            $("#querytable td:contains('B')").css('background-color','#FDE480'),
            $("#querytable td:contains('C')").css('background-color','#9BBB59');
            });

等等。我使用

query.php

为

index.php

生成一个动态表，并使用AJAX自动刷新它。通过以下方式提取数据：

$sql=“从记分板选择*”

以及生成的表，其中包含：

// Construct the table

echo "<table id='querytable'>\n";

我制作了一个名为
highlight.js
的JavaScript文件，其中包含：

Industry risk
--------------
      A
      B
      C

$(function() {
            $("#querytable td:contains('A')").css('background-color','#C0504D'),
            $("#querytable td:contains('B')").css('background-color','#FDE480'),
            $("#querytable td:contains('C')").css('background-color','#9BBB59');
            });

我尝试使用以下方法从
query.php
调用它：

// Load higlighting syntax

echo "<script type='text/javascript' src='highlight.js'></script>";

问题是highlight.js运行得太早。它立即运行，尽职尽责地查找所有匹配的元素并给它们着色，但是，唉，异步查询还没有插入要匹配的内容

它可能看起来是瞬间的，但事实上（我相信）你有一个操作顺序问题

因此，要解决这个问题，需要在查询内容被注入页面后运行着色代码。这将作为用于引入query.php内容的
$.ajax
或
$.load
调用（问题描述中未指定）的一部分发生

希望这有帮助
 问题在于highlight.js运行得太早。它立即运行，尽职尽责地查找所有匹配的元素并给它们着色，但是，唉，异步查询还没有插入要匹配的内容

它可能看起来是瞬间的，但事实上（我相信）你有一个操作顺序问题

因此，要解决这个问题，需要在查询内容被注入页面后运行着色代码。这将作为用于引入query.php内容的
$.ajax
或
$.load
调用（问题描述中未指定）的一部分发生

希望这有帮助
 为什么不直接使用css呢

将该值添加到
td
上的
class
属性中，然后在css中设置规则

添加类，如
class='CONTENTS'
：

echo "<td align='center' class='{$row['codcliente']}'> ...

在您的示例中，内容是简单有效的css，如果内容有空格或以数字开头，则需要将它们转换为有效的css类名

（编辑，我将js代码复制到css中，但没有修改语法）
为什么不直接使用css

将该值添加到
td
上的
class
属性中，然后在css中设置规则

添加类，如
class='CONTENTS'
：

echo "<td align='center' class='{$row['codcliente']}'> ...

在您的示例中，内容是简单有效的css，如果内容有空格或以数字开头，则需要将它们转换为有效的css类名

（编辑，我将js代码复制到我的css中，但没有修改语法）
jimbojw向您解释了代码不起作用的原因，您需要在更新表后调用highlight.js中的代码。他认为您在AJAX部分使用jQuery，但事实并非如此。所以您有两个选择，将代码更改为使用jQuery AJAX函数，或者从xmlHttp.onreadystatechange内部调用突出显示的代码

xmlHttp.onreadystatechange=function(){
    if(xmlHttp.readyState==4){
        document.getElementById(divid).innerHTML=xmlHttp.responseText;
        setTimeout('refreshdiv()',seconds*1000);

        // call the code after updating the DOM tree
        $("#querytable td:contains('A')").css('background-color','#C0504D'),
        $("#querytable td:contains('B')").css('background-color','#FDE480'),
        $("#querytable td:contains('C')").css('background-color','#9BBB59');
    }
}

jimbojw向您解释了代码不起作用的原因，您需要在更新表后调用highlight.js中的代码。他认为您在AJAX部分使用jQuery，但事实并非如此。所以您有两个选择，将代码更改为使用jQuery AJAX函数，或者从xmlHttp.onreadystatechange内部调用突出显示的代码

xmlHttp.onreadystatechange=function(){
    if(xmlHttp.readyState==4){
        document.getElementById(divid).innerHTML=xmlHttp.responseText;
        setTimeout('refreshdiv()',seconds*1000);

        // call the code after updating the DOM tree
        $("#querytable td:contains('A')").css('background-color','#C0504D'),
        $("#querytable td:contains('B')").css('background-color','#FDE480'),
        $("#querytable td:contains('C')").css('background-color','#9BBB59');
    }
}

谢谢@jim，我添加了JavaScript文件的内容，但是我在任何地方都找不到
$.ajax
或
$.load
。我将把我的着色代码放在哪里？谢谢@jim，我添加了JavaScript文件的内容，但是我在任何地方都找不到
$.ajax
或
$.load
。我应该把着色代码放在哪里？或者将类添加到表行：然后#querytable tr.A td{…}谢谢@joe，但我有点迷路了。
style.css
中是否定义了
#querytable td.A{'background-color'，'#C0504D'}
？（我已经使用了样式表）。同一个选择器可以有多个css规则。我刚刚编辑了上面的css规则，因为它们是从js复制的。只需将它们添加到现有样式表中。它们只会影响
#querytable
中的
td
s。我不确定我是否从变量名中获得了正确的语义，如果颜色适用于整行，请将其设置在
tr
上，并按照上面的Tank所述修改css规则。快速问题@joeshmo，我将如何使用两个词设置规则
#querytable td.Very high{background color:#E46D0A；}
我会设置
class='Very high'
，然后将规则设置为
。Very high
，但如果您要保留两个单词，css会考虑这两个独立的类，您仍然可以这样使用它们，语法是
#querytable td.Very.high
或将类添加到表行：然后#querytable tr.A td{…}谢谢@joe，但我有点迷路了。
style.css
中是否定义了
#querytable td.A{'background-color'，'#C0504D'}
？（我已经使用了样式表）。同一个选择器可以有多个css规则。我刚刚编辑了上面的css规则，因为它们是从js复制的。只需将它们添加到现有样式表中。它们只会影响
#querytable
中的
td
s。我不确定我是否从变量名中获得了正确的语义，如果颜色适用于整行，请将其设置在
tr
上，并按照上面的Tank所述修改css规则。快速问题@joeshmo，我将如何使用两个词设置规则
#querytable td.Very high{background color:#E46D0A；}
我会设置
class='Very high'
，然后用
设置规则。Very high
，但是如果你想保留它两个单词，css考虑这两个独立的类，你仍然可以这样使用它们，语法是
#querytable td.Very.high