jQuery - 动态改变CSS

时间:2011-10-27 23:17:43

标签: javascript jquery css

我想动态更改特定元素的CSS。 以下硬编码的jQuery语句有效:

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

但是,我需要“1”作为变量(“dataNum”),实际的url需要是一个名为“URL”的变量。

我一直在尝试各种转义字符,但无法正常工作而没有错误。 这是我的最新消息:

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

我错过了什么?感谢。

6 个答案:

答案 0 :(得分:2)

jQuery选择器不是魔术;它们只是普通的字符串 你不需要逃避任何事情。

相反,你只需要普通的字符串连接。

答案 1 :(得分:1)

您可以使用字符串连接来执行此操作,如:

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

答案 2 :(得分:0)

尝试

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

答案 3 :(得分:0)

这只是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);

答案 4 :(得分:0)

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

答案 5 :(得分:0)

你真的不需要转义,代码应该可以工作:

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