内联样式属性的CSS选择器 [英] CSS selector by inline style attribute

问题描述

是否有CSS选择器通过其内联样式属性值选择此元素？

Is there a CSS selector to select this element by its inline style attribute value?

<div style='display:block'>...</div>

类似于

something like

div[cssAttribute=cssValue]

推荐答案

内联样式属性与任何其他HTML属性没有区别，并且可以与子字符串属性选择器匹配：

The inline style attribute is no different to any other HTML attribute and can be matched with a substring attribute selector:

div[style*="display:block"]

是因为这个原因，然而它非常脆弱。由于属性选择器不支持正则表达式，因此只能执行属性值的精确子字符串匹配。例如，如果你在属性值的某个地方有一个空格，如下所示：

It is for this very reason however that it's extremely fragile. As attribute selectors don't support regular expressions, you can only perform exact substring matches of the attribute value. For instance, if you have a space somewhere in the attribute value, like this:

<div style='display: block'>...</div>

直到您更改您的选择器以适应空间，它才会匹配。然后它会停止匹配 不包含空格的值，除非包含所有排列和广告名称。但是，如果你正在处理一个内联样式声明本身根本不可能改变的文档，那么你应该没问题。

It won't match until you change your selector to accommodate the space. And then it will stop matching values that don't contain the space, unless you include all the permutations, ad nauseum. But if you're working with a document in which the inline style declarations themselves are unlikely to change at all, you should be fine.

还要注意这是不是根据DOM中反映的实际指定，计算或使用的值选择元素。 对于CSS选择器是不可能的。

Note also that this is not at all selecting elements by their actual specified, computed or used values as reflected in the DOM. That is not possible with CSS selectors.

这篇关于内联样式属性的CSS选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！