CSS没有响应通过jQuery设置的数据属性

bir*_*aum 8 css jquery custom-data-attribute

我正在data-position通过jQuery在几个div上设置文档的属性.设置肯定有效.例如,在Chrome控制台中调用以下代码即可返回'left'.

$('.card-container').data('position');
Run Code Online (Sandbox Code Playgroud)

但是在CSS中,下面没有做任何事情.

[data-position='left']
Run Code Online (Sandbox Code Playgroud)

data-position="left"然而,div中的硬编码工作正在进行.我究竟做错了什么?谢谢您的帮助

Ror*_*san 16

data按原样设置属性意味着它存储在jQuery的缓存中(它是内存中的对象),它不会被设置为元素的属性,因此没有CSS选择器会看到它.

您需要手动设置data属性attr才能使此工作:

$('.card-container').attr('data-position', 'left');
Run Code Online (Sandbox Code Playgroud)

但请注意,在检索数据值时,这会略微降低性能,尽管我们说的是毫秒级.