用于基于包含值数组的data-*属性进行选择的CSS?

ing*_*939 3 css css-selectors

我需要根据名为"data-attributes"的属性中的数据选择HTML元素.在Firefox的DOM Inspector中,属性值如下所示:

<div data-attributes="[{"Id":50,"Code":"LIC","ShowInSessionFilter":false}]">
Run Code Online (Sandbox Code Playgroud)

我尝试过使用下面的CSS选择器,但无济于事:

div[data-attributes~="LIC"]
Run Code Online (Sandbox Code Playgroud)

所以我假设属性值不是这样的字符串,但是Inspector将javascript对象显示为Json字符串.问题是,如何根据其包含的对象中的一个键/值对选择节点?这在CSS中可行吗?

Ada*_*ppe 7

就css而言,该属性只是一个字符串.您可以使用div[data-attributes*="LIC"],虽然这不是检查json键 - CSS中的*=运算符只是意味着该属性包含该子字符串.所以它也匹配["LIC2":"foo"]和类似的.

也许[data-attributes*=":\"LIC\""]对你的情况来说已经足够好了.