Jquery通过JSON通过名称更改几个标签的CSS颜色答案

【问题标题】：Jquery change CSS color of several label by name passing through JSONJquery通过JSON通过名称更改几个标签的CSS颜色
【发布时间】：2014-09-28 13:51:48
【问题描述】：

我有一个简单的 JSON 数组，其中包含有问题的标签名称，它是在表单验证后由 php 创建的。我希望有一个通用的 Jquery 函数，我可以在其中传递标签列表，运行一个循环（每个？）并更改列表中所有存在的颜色？

例如：

  var json = ["email", "password"];
  $(document).ready(function () {
     $('json').each(function () {
         $(this).css("color", "red");
     });
 });

 <label for="email"> Email </label> 
 <label for="password"> Password </label>

我在循环和调用标签时不知所措，我尝试了几个选项，但运气不佳，希望你们中的一个可以帮助我并指出正确的方向？非常感谢您！

【问题讨论】：

标签： jquery css json label

【解决方案1】：

您可以使用attribute 选择器访问标签，如下所示：

var json = ["email", "password"];
$(document).ready(function () {
  $.each(json,function (index,value) {
     $("label[for='"+value+"']").css("color", "red");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="email"> Email </label> 
<label for="password"> Password </label>

附注：在属性值周围加上引号会更安全，否则 it won't work 的值包含多个单词

【讨论】：

@Anx..yes 如 Tj 所述，如果您有多个单词，请在属性值周围使用引号，但在您的情况下，您可以使用单引号，因为您只有一个单词...... .

【解决方案2】：

修改您的 foreach 循环，如图所示：

$.each(json,function(index,value){
   $("label[for='" + value + "']").css('color','red')
});

编辑：-

现在您的完整代码如下所示：

var json = ["email", "password"];
$(document).ready(function () {
  $.each(json,function (index,value) {
     $("label[for='" + value + "']").css("color", "red");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <label for="email"> Email </label> 
 <label for="password"> Password </label>

如果你只想使用属性来定位其他 DOM 元素，那么试试这个：

var json = ["email", "password","email id"];
$(document).ready(function () {
  $.each(json,function (index,value) {
     $("[for='" + value + "']").css("color", "red");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<label for="email"> Email </label> 
<label for="password"> Password </label>

<span for="email id"> Email id </label>

【讨论】：