使用javascript应用属性时CSS属性选择器不工作？

这是我的CSS选择器，如果页面加载时DOM中已经存在style属性，它可以正常工作：

但是，如果我使用javascript隐藏.variations_按钮div，选择器将不再工作：

.variations_button[style*="display: none;"] + div

---

知道怎么了吗？看起来CSS没有刷新，因为如果我使用inspector编辑另一个属性，颜色会立即变为红色

因为您使用的选择器，

[style*=“display:none；”]

正在查找

style

属性中的

“display:none；”

的确切字符串，它需要浏览器的JavaScript引擎插入该精确字符串，包括空格字符（顺便说一句，在Chrome 39/Windows 8.1中是这样做的）. 对于您的特定浏览器，您可能需要删除空格，并针对most1浏览器，使用两种版本的属性值字符串，给出：

$(document).click(function(){
    $('.variations_button').hide();
}); 

.variations\u按钮[样式*=“显示：无；”]+div，
.U按钮[样式*=“显示：无；”]+div{
颜色：红色；
}

asd
test

JavaScript添加样式时是否存在空格字符？如果是我的代码，我会用类显示/隐藏元素，并在选择器中使用该类。当然，我尝试使用空格字符。是的，类隐藏/显示会更容易，但这是针对WordPress插件的，我不想覆盖核心代码。请确保检查第二个JSFIDLE链接，刚刚编辑了问题，因为我在那里粘贴了错误的链接。当然，我测试了有空格和没有空格。正如我在问题中提到的，它在没有javascript部分的情况下工作。但是一旦使用javascript添加了style属性，它就无法运行。甚至你的例子。当然，切换类会更容易，但这是一个WordPress插件，我不想覆盖核心代码。你能用演示重现这种行为吗？因为似乎有什么东西（但我不知道，也看不到，什么东西）没有被留下。天啊，对不起，我在我的问题中插入了错误的链接。查看第二个JSFIDLE:）

.variations_button[style*="display: none;"] + div,
.variations_button[style*="display:none;"] + div