Güncelleniyor HTML verileri doğru öznitelik ancak sayfa

Question

gösterilmiyor değişiklikler bu HTML vardır:

<input type="text" id="query" data-source="whatever"> 

Ben veriler başarıyla "ne olursa olsun" Değişiklikleri yani öznitelik değiştirir bazı jquery "test"

$(function() { 
    $('#query').data('source', 'test'); 
    console.log($('#query').data()); 
}); 

için

Ancak sayfayı Chrome kullanarak inceliyorsam, veri özelliği güncellenmemiştir. Bunu yazdırabilirim ancak yeni değeri denetleyemiyorum! Çok karışıklık. Herhangi bir fikir? Burada

bu koduna sahip keman olarak fiddle

Answer 1

veri öğesi (kullanım attr veya bunun için desteklemek) depolanmaz bir göz atın. Bunun yerine jQuery, $ .cache dosyasında tutar.

Answer 2

olduğunu. $('#query') bir işlev çağrısı ve buna .data('source', 'test') tepkisini Atama, çünkü hatası ("atamasında geçersiz sol tarafı") sahiptir

$(function() { 
    $('#query') = $('#query').data('source', 'test'); 
    console.log($('#query').data()); 
}); 

.

$(function() { 
    $('#query').data('source', 'test'); 
    console.log($('#query').data()); 
}); 

için

Değişim bunu gayet çalışacaktır.

http://jsfiddle.net/r5YV9/10/

Answer 3

sen (hayır, gerçekten deli değil) o zaman hem jQuery'nin önbelleğini ve güncellemek için DOM ihtiyaç stil uygulamak için veri özelliğini kullanarak gibi deli bir şey yapıyorsanız. Her iki

var data = function($element, key, value) { 
    $element.data(key, value); 
    $element.attr('data-'+key, value); 
} 

data($element, key, value); 

Not yapan bir yönteme DOM güncelleme olmayacak jQuery

$element.data(key, value); 

üzerinden

Swap: Hep jQuery değişkenlerin önüne $ koymak içinde Bu konuda herkesin kafası karışır. ;)