element表格 鼠标点击改变某一行的字体颜色 默认选中第一行

好的，您可以使用以下代码实现在鼠标点击表格的行时改变该行字体颜色以及默认选中第一行：

HTML代码：

<table id="myTable">
  <tr>
    <th>名称</th>
    <th>数量</th>
  </tr>
  <tr>
    <td>苹果</td>
    <td>10</td>
  </tr>
  <tr>
    <td>香蕉</td>
    <td>5</td>
  </tr>
  <tr>
    <td>橙子</td>
    <td>8</td>
  </tr>
</table>

JavaScript代码：

// 获取表格元素
var table = document.getElementById("myTable");

// 获取表格中所有行
var rows = table.getElementsByTagName("tr");

// 默认选中第一行
rows[1].style.color = "red";

// 为每一行添加鼠标点击事件监听器
for (var i = 1; i < rows.length; i++) {
  rows[i].addEventListener("click", function() {
    // 先将所有行的字体颜色设置为黑色
    for (var j = 1; j < rows.length; j++) {
      rows[j].style.color = "black";
    }
    // 将鼠标点击的行的字体颜色设置为红色
    this.style.color = "red";
  });
}

在这个例子中，我们首先获取表格元素和所有行元素，然后将第一行的字体颜色设置为红色，表示默认选中第一行。接着，我们为每一行添加鼠标点击事件监听器，在回调函数中先将所有行的字体颜色设置为黑色，然后将鼠标点击的行的字体颜色设置为红色。这样，当用户点击某一行时，该行的字体颜色就会改变为红色，表示该行被选中了。希望这可以帮助您解决问题！