根據javascript中屬性值的樣式元素

我打算使用相同的XHTML5文件進行數據存儲和顯示。在設計時，該文件將在瀏覽器中查看。在編譯時，它將被解析以生成UI內容。根據javascript中屬性值的樣式元素

我想存儲顏色數據作爲一些列表項的屬性。然後，當頁面被加載時，來自這些列表項目的顏色數據應該被「轉移」爲該項目的背景顏色，以便我可以在瀏覽器中可視地檢查顏色，並且可以容易地解析該十六進制字符串來自XHTML。

我已經有（只有一個各部分的線）：

(...) 
<body> 
    <ul> 
     <li data-color="#ffeeaacc">EMG</li> 
    </ul> 
    <script> 
     $('a[data-color]').?????? 
    </script> 
</body>

我非常非常的n00b在JavaScript和jQuery，並不能找出我應該從現在就做。最終的結果應該是等同於：

<li data-color="#ffeeaac" style="background: #ffeeaacc">EMG</li>

謝謝！

#ffeeaacc不是有效的HEX顏色。 HEX顏色只包含三對兩位數字，而不是四位。

$('*[data-color]').each(function(i, e){ 
    $(e).css('background-color', $(e).data('color')); 
});

2012-03-20 16:19:52 Alex

不錯。沒有意識到jQuery使用.data（）方法處理data- *屬性。 +1 – 2012-03-20 16:22:43

我認爲這是最正規的答案（它工作得很好），並且還提到了我的錯誤（我來自rgba世界...） – heltonbiker 2012-03-20 16:28:00

很高興爲您提供幫助。（如果你想使用RGBA顏色，這也應該工作：http://jsfiddle.net/CQqRX/3/。用最新的瀏覽器） – Alex 2012-03-20 16:31:09

這應該工作：

$('li[data-color]').each(function() { 
    $(this).css('background-color', $(this).attr('data-color')); 
});

2012-03-20 16:20:28

CYOU應該使用類似的東西：

jQuery('li[data-color]').each(function() { 
    jQuery(this).css({'background-color':jQuery(this).data('color')}); 
});

你將不得不使用這個曾經DOM加載

2012-03-20 16:21:14 haltabush

請閱讀[編輯幫助]（http://stackoverflow.com/editing-help）頁面，瞭解如何格式化您的答案。 – 2012-03-20 16:22:46

Thx用於編輯，我在做同樣的工作:) – haltabush 2012-03-20 16:22:50

如果JavaScript位於HTML源代碼之後，則不必等到DOM完全加載。 – Alex 2012-03-20 16:28:09

這應該對以前提供依靠2件事你 http://jsfiddle.net/zrARP/

$('li[data-color]').each(function(){ 
    var color = $(this).data("color"); 
    $(this).css('background-color',color); 
})

2012-03-20 16:22:02

所有的答案工作正常：

2012-03-20 16:31:36 bPratik

我很感激你的興趣，但實際上我想要的是以前答案提供的行爲。無論如何，我可能會回來看看這些更普遍的做法。謝謝！ – heltonbiker 2012-03-20 16:46:15

回答