Javascript 选择另一个元素时（通过角度）将类应用于一个元素的最佳方法？

我在Bootstrap中有一个很长的表单，标签在一列中，输入在另一列的右边。为了帮助用户澄清他正在编辑的字段，我想在聚焦于相应输入时更改标签的颜色，然后将颜色更改回默认的模糊。我可以在jQuery中轻松地做到这一点，但由于jQuery和Angular之间有很多重叠，所以我不希望两者都包括在内。也就是说，我对Angular还很陌生，所以任何帮助都将不胜感激。谢谢

---

编辑：为了澄清，我正在尝试更改标签上的类，而不是输入本身，因此纯CSS解决方案在这里不适用。

您将CSS设置为焦点。就这么简单。没有jQuery，没有AngularJS

input:focus
{
  background-color:yellow;
}

------------编辑-----------------
因为海报要求突出显示标签，而不是输入。我使用angularJS指令提供了另一个答案

HTML看起来像这样

  <label for="firstname">First name:</label>
  <input id="firstname" hilight-label />

---

演示：

以下是我迄今为止提出的最佳解决方案：

<div class="col-sm-3">
    <label for="name" ng-class="{highlight: $scope.highlightName}">Name:</label>
</div>
<div class="col-sm-3">
    <input id="name" ng-focus="$scope.highlightName = true" ng-blur="$scope.highlightName = false" />
</div>

姓名：

---

这是可行的，但我觉得应该有一个更简洁的方法来解决这个问题，所以如果有人有更好的解决方案，请发布它

您可以使用

ng focus

和

ng blur

指令。对，但我正在尝试更改另一个div中包含的标签的CSS类，而不是关注的输入。Angular不是一个DOM操纵库，因为它们在文档中明确声明。如果您需要DOM操作（听起来像是这样），您应该咬紧牙关，包括jQuery。或者你可以尝试一些普通的javascript（首选，因为你只实现你需要的东西，而不是用巡航导弹点燃香烟）“Angular不是文档中明确说明的DOM操纵库。”你能告诉我文档中在哪里说的吗？如果不进行DOM操作，我不确定双向数据绑定和指令（如ng类）的意义何在。对不起，我说错了——是的，但不是jQuery。查看您正在查找的第一个常见陷阱

ng类

方向，该方向仅在我尝试更改输入字段本身的CSS或包装在输入字段内的标签时有效，这两种方法都不适用于本例。提供了另一个使用AngularJS方向的edit解决方案，这正是我所寻找的。非常感谢。

<div class="col-sm-3">
    <label for="name" ng-class="{highlight: $scope.highlightName}">Name:</label>
</div>
<div class="col-sm-3">
    <input id="name" ng-focus="$scope.highlightName = true" ng-blur="$scope.highlightName = false" />
</div>