jQuery - 動的に変更するCSS

Question

特定の要素のCSSを動的に変更したい。 次のハードコードされたjQueryの文が機能：

$('.people div[data-face="1"] i').css('background-image', 'url(http://localhost:58888/_pictures/picture_000.jpg)'); 

をしかし、私は（「dataNum」）、変数であることを「1」が必要と実際のURLは「URL」と呼ばれる変数である必要があります。

私はさまざまなエスケープ文字を試してきましたが、エラーなしで動作させることはできません。 は、ここに私の最新です：

$("\'.people div[data-face=\" " + dataNum + '\"] i\').css(\'background-image\', \'url(' + URL + ')\' '); 

私は何をしないのですか？ありがとう。

Answer 1

あなたが好きな文字列連結でそれを行うことができます：あなたは本当にエスケープする必要はありません

$('.people div[data-face="' + dataNum + '"] i').css('background-image', 'url('+URL+')'); 

Answer 2

jQueryセレクタは魔法ではありません。彼らは普通の文字列です。
何かをエスケープする必要はありません。

代わりに、通常の文字列の連結が必要です。

Answer 3

てみ

$('.people div[data-face="'+dataNum+'"] i').css('background-image', 'url(\''+URL+'\')'); 

Answer 4

それだけで文字列dataNumのための数学（連結）およびurl変数のための単純な代入です：

$('.people div[data-face="' + dataNum + '"] i').css('background-image', url); 

か、文字列の数学は、よりに壊れ見たい場合は詳細：

var selector = '.people div[data-face="'; 
selector += dataNum; 
selector += '"] i'; 
$(selector).css('background-image', url); 

Answer 5

$('.people div[data-face="' + dataNum + "'"] i').css('background-image', 'url(' + URL + ')'); 

Answer 6

、次のコードは動作するはずです：

$('.people div[data-face="'+dataNum+'"] i').css('background-image', 'url('+URL+')');