如何使用jQuery动态更改SVG圆填充颜色的颜色

Question

我想动态更改SVG元素的圆圈的颜色。 如何根据AJAX通话响应中的值动态更改圆圈的颜色？

HTML：

<tr>
  <td style="width: 33.3333%; text-align: center;">
    <svg height="100" width="100">
      <circle id="parking_slot" cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="green" />
    </svg>
  </td>
</tr>

JavaScript：

$(document).ready(function() {
  $.ajax({
    url: 'url',
    type: 'GET',
    data: {
      format: 'json'
    },
    success: function(response) {
      if (response.field1 < 50) {
        $("#field1").text("car is parked");
        $("#parking_slot").fill("red");
      } else {
        $("#field1").text("car is not parked");
        $("#parking_slot").fill("green");
      }
    },
    error: function() {
      $('#errors').text("There was an error processing your request. Please try again.");
    }
  });
});

Answer 1

像这样使用：

$("#parking_slot").css("background-color", "red");