关键步骤可能是：
1.选择所有tbody行，并迭代它们。
1.一个函数，用于获取元素的数字字符串内容，并将其强制为适当的数字。
1.可以添加到相关表格单元格的一些新类：一个“绿色”可以应用于该行，而“tick”可以将tick呈现为内容。
在这个例子中，我做了一些让步/假设
1.所有金额均使用小数 * 点 *。你的问题中有一些关于你使用的地区的混乱（导致美元和欧元的混合），这不是特别有用。
1.我已经从金额中删除了货币符号，以使数字的解析更容易。您可以将“MONEY”表标题更改为“$”，以确保含义不会丢失。
1.我把最后一栏留空了。
1.我已经从td CSS规则中删除了背景色，并将其添加为tbody tr规则，以确保新应用的绿色保持不变。

// Function to get the number from the text content of
// a DOM element
function getNumber(el) {
  return parseFloat(el.textContent);
}

// Cache the rows. Cache the formatted total by passing
// the #money element through the getNumber function
const rows = document.querySelectorAll('tbody tr');
const total = getNumber(document.querySelector('#money'));

// For each row get its second and third cells. From the
// second produce a formatted number from its text content.
// If it's less than the total add a "green" class to the row,
// and a tick to the third cell
rows.forEach(row => {
  const sum = row.querySelector('td:nth-child(2)');
  const tick = row.querySelector('td:nth-child(3)');
  if (getNumber(sum) <= total) {
    row.classList.add('green');
    tick.classList.add('tick');
  }
});

table {
  width: 75%;
  top: 0;
}

th {
  background-color: purple;
  color: #f1f1f1;
  font-size: 15px;
  padding: 4px;
}

tbody tr {
  background-color: #376282;
}

td {
  color: #fff;
  font-size: 15px;
  padding: 4px;
  text-align: center;
}

#money {
  background-color: gold;
  color: blue;
  font-size: 15px;
  padding: 4px;
  text-align: center;
}

.green { background-color: green; }
.tick:after { content: '✓'; }

<table id="table-id">
  <thead>
    <tr>
      <th>A/A</th>
      <th>$</th>
      <th>GOAL</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>100</td>
      <td></td>
    </tr>
    <tr>
      <td>2</td>
      <td>200.25</td>
      <td></td>
    </tr>
    <tr>
      <td>3</td>
      <td>500</td>
      <td></td>
    </tr>
  </tbody>
</table>

<h3>Total $<span id="money">200.25</span></h3>

附加文件

• querySelectorAll
• querySelector
• parseFloat
• classList
• nth-child()

从你的问题中，我得到了一个观点，如果你输入的值为100或100以上，那么第一列（A/A）应该变成绿色（背景色）。这可以通过添加js来实现。

Goal();
 
 
   function Goal() {
      var table = document.getElementById("table-id");
      var rows = table.getElementsByTagName("tr");

      var totalMoney = 0;

      for (var i = 1; i < rows.length; i++) {
        var row = rows[i];
        var moneyCell = row.cells[1];
        var goalCell = row.cells[2];

        var money = parseFloat(moneyCell.textContent.replace(/[^0-9.-]+/g, ""));

        if (money >= 100) {
          row.cells[0].style.backgroundColor = "green";
          goalCell.textContent = "✓";
        } else {
          row.cells[0].style.backgroundColor = "";
          goalCell.textContent = "--";
        }

        totalMoney += money;
      }

      document.getElementById("money").textContent =
        "€" + totalMoney.toFixed(2);
    }

.table {
      width: 100%;
      top: 0;
    }

    th {
      background: purple;
      color: #f1f1f1;
      font-size: 15px;
      padding: 4px;
    }

    td {
      background: #376282;
      color: #fff;
      font-size: 15px;
      padding: 4px;
      text-align: center;
    }

    #money {
      background: gold;
      color: blue;
      font-size: 15px;
      padding: 4px;
      text-align: center;
    }

<table id="table-id">
    <thead>
      <tr>
        <th>A/A</th>
        <th>MONEY</th>
        <th>GOAL</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>$100</td>
        <td>&#x2713;</td>
      </tr>
      <tr>
        <td>2</td>
        <td>$510</td>
        <td>--</td>
      </tr>
      <tr>
        <td>3</td>
        <td>$15</td>
        <td>--</td>
      </tr>
    </tbody>
  </table>

  <h3>Total: <span id="money">€100,00</span></h3>