Question

是否可以使用属性选择器来部分搜索内联样式属性？

有没有人能找到让这段代码正常工作的方法？

似乎无法执行此操作.hidden[style*="display: block"] + .below，甚至只有[style]

Answer 1

~~您尝试使用的属性选择器不是legit CSS，尽管它是一个jQuery属性选择器。据我所知，CSS仅限于[attribute=value]，[attribute~=value]和[attribute|=value]。~~ （derp，见下文）

但是，既然你已经在使用jQuery来切换hidden div，那么只需要在below div上同时切换一个类就好了，而不是摔跤使用属性选择器（除非它有更多）。

修改了jQuery：

$(function() {
  $('html').click(function() {
    $('.hidden').slideToggle();
    $('.below').toggleClass('yellow');
  });
});

和CSS：

/* Margin of Below should reduce when hidden is opened */
.yellow {
  margin-top: 10px; 
  background: yellow;
}

Fiddle here

编辑：好的，关于属性选择器，我对此有所了解，它是合法的CSS3;我不知道有关浏览器支持的详细信息，但我猜它会在所有常见的“现代”浏览器中得到支持。此外，IE7明显存在一个问题，具体针对style属性。在http://www.impressivewebs.com/attribute-selectors/有一个很好的写作。

再次：虽然我找不到任何明确确认的内容，但看起来属性选择器只适用于实际硬编码到html中的属性;基本上它只是解析字符串，而不是检查dom元素的“状态”呢？

CSS属性选择器与兄弟选择器混合使用

1 个答案: