Как поместить атрибут data в нижний регистр?

Question

У меня есть эта разметка:

<div data-answer=" True" class="question-container"></div> 

С этим ЯШАМИ:

Drupal.behaviors.articleQuiz = (function(){ 
    var _attach = function(context){ 
      $('.question-container', context) 
      .once() 
      .each(function(i, section){ 
       new ArticleQuiz($(section)); 
      }); 
    }; 

    return { 
      attach: _attach 
    }; 
})(); 

function ArticleQuiz($el){ 
    this.$el = $el; 
    this.$el.data('answer'); // the value of this needs to be lower case 
    this.quizLogic(); 
    return this; 
} 

ArticleQuiz.prototype.quizLogic = function(){ 
    var THIS = this; 

    $('.quiz-cols a', this.$el) 
     .on('click',function(e) { 
      e.preventDefault(); 
      var $target = $(e.target); 

     // exit if choice already made: users can't change their pick 
     if (THIS.$el.hasClass('answered')) return; 

     $target.addClass('selected'); 

     THIS 
      .$el 
      //add correct or incorrect class depending on the selected answer and the correct answer 
      .addClass(($target.data('value') == THIS.answer) ? 'correct':'incorrect') 
      //add the answered class so in the future we know that this question was already answered 
      .addClass('answered'); 
     }); 

    return THIS; 
}; 

самым странным, что в console.log возвращает атрибут данных ответа в нижнем регистре, но в HTML он все еще выглядит как это:

Что я могу сделать?

ПРИМЕЧАНИЕ: Это значение ответа данных динамически заполняется PHP. так что реальная разметка выглядит следующим образом

<div data-answer="<?php print render($content['field_paragraph_answer']); ?>" class="question-container"></div 

Answer 1

Вы не заходящего атрибут фактического HTML DOM элемента в коде, обратите внимание на комментарии ниже, я установил значение .data(), но и вы должны вручную установить обратно атрибут с attr(), чтобы обновить HTML.

Эта часть не всегда необходима, потому что jQuery будет отслеживать data в фоновом режиме. Просто, если вам нужно это для селекторов CSS или jQuery позже.

function ArticleQuiz($el){ 
    this.$el = $el; 

    //get data('answer') and set to lowercase 
    this.answer = this.$el.data('answer').toLowerCase(); 

    //set data and HTML attributes to lowercase value of this.answer 
    this.$el.data('answer', this.answer).attr('data-answer', this.answer); 

    this.quizLogic(); 
    return this; 
}