仅定位所选数据属性?

时间:2013-11-16 23:29:47

标签: javascript jquery css target

有没有办法选择/定位值为“winter”的'data-season'?

我的HTML:

<li data-season="summer">summer
  <ul class="groups">
   <li data-item="beach">beach</li>
   <li data-item="Hawaii">Hawaii</li>
   <li data-item="Beach Ball">Beach Ball</li>
   <li data-item="hot sun">hot sun</li>
  </ul>
</li>

<li data-season="winter">winter
  <ul class="groups">
   <li data-item="snow">snow</li>
   <li data-item="glacier">glacier</li>
   <li data-item="hot soup">hot soup</li>
   <li data-item="snow man">snow man</li>
   <li data-item="heater">heater</li>
  </ul>
</li>

在我的Jquery中,我能够从我的返回函数中获得“winter”字符串,

现在我想改变雪,冰川,热汤,雪人和加热器的css,但css不适用于夏天,我应该怎么做?

2 个答案:

答案 0 :(得分:3)

  $('[data-item="winter"]').css('background':'red');

  foo = 'winter';
  $('[data-item="'+foo+'"]').css('background':'red');

DEMO

ps这也适用于css规则

 [data-item="winter"]{
     border:1px solid red;
 }

答案 1 :(得分:0)

我想补充一下,因为我花了一些时间来解决这个问题,它不能使用动态创建的对象使用.data()函数,为了使它我在每个精确命名的对象上创建了一个属性作为传递给函数的data()键。