基于容器值动态修改HTML/CSS字体颜色的问题求助

你的代码没生效主要有三个问题：

• JS遍历的是带_container后缀的tr，但#MAP#PPOINDIVIDUAL_value所在的tr没有这个标识，导致根本没检测到目标元素
• CSS里的:empty选择器无效，因为<a>标签里固定有“Sample Text”，永远不会触发空状态
• 现有JS逻辑是批量检测多个值，不符合你只针对#MAP#PPOINDIVIDUAL_value的需求

直接修改JS代码就能解决，以下是修正后的完整代码：

修改后的JavaScript #

document.addEventListener("DOMContentLoaded", function () {
    // 直接定位到目标span
    var individualValue = document.querySelector("#MAP#PPOINDIVIDUAL_value");
    // 获取"Sample Text"对应的a标签
    var headerLink = document.querySelector("#MAP#PPOProspectTileViewDataForm .bbui-forms-summarytile-headerlinkcontainer a");
    
    // 检查目标span是否为空或仅含空白字符
    if (individualValue && individualValue.innerText.trim() === "") {
        headerLink.style.color = "red";
    } else {
        // 有值时恢复默认颜色（可根据需求调整为具体色值）
        headerLink.style.color = "";
    }
});

移除无效CSS规则 #

把这段完全没用的CSS删掉：

a.#MAP#BOLD:empty {
  color: red;
}

说明 #

• 直接定位#MAP#PPOINDIVIDUAL_value元素，精准检测它的内容状态
• 当目标元素为空时，直接修改“Sample Text”的颜色为红色
• 有值时清空内联样式，恢复默认样式（如果需要固定默认色，可替换为具体颜色值）

内容的提问来源于stack exchange，提问作者Cwnova