2011-10-21 7 views
1

jQueryを使用するv1.6.4、jQuery - CSS propertyName

いくつかのオブジェクトを動的にフォーマットしようとしています。ここで

は私のコードです:

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function(){ 

    style = {'color':'#F30', 'font-size':'20px'}; 

    /* example:1 - not working */ 
    for(attr in style) $('.text').css({attr:style[attr]}); 

    /* example:2 -works */ 
    //$('.text').css({'color':style['color']}).css({'font-size':style['font-size']}); 

}) 
</script> 
</head> 
<body> 
    <div class="text">This is the text.</div> 
</body> 
</html> 

例1が動作していないのはなぜ?他のアプローチがありますか?

Chromeコンソールにエラーは表示されません。 オブジェクト "style"はJSONを形成するので、2番目の例のように、すべてのスタイルを手動で記述するのではなく、コードを最適化しようとしています。

ありがとうございました。

答えて

6
$('.text').css(style); 

なぜ機能していないのは、JavaScriptのリテラルオブジェクトを作成したためです。これは、2番目の例でパラメータを渡すために使用しているjsonのようなものです。それはあなたのオブジェクトの上にループしないので、動作しませんので、不正な形に見えます。あなたは既に頑張っているので、スタイルを渡してください。