使用 JQuery，如何在 IE 中定位具有样式属性的元素？

Posted 2023-05-09

【中文标题】使用 JQuery，如何在 IE 中定位具有样式属性的元素？

【英文标题】：Using JQuery, how do I target an element with a style attribute in IE?

【发布时间】：2011-07-08 04:40:28

【问题描述】：

使用 JQuery，我的目标如下：

<li style="margin-left: 15px;">blah<li>

使用此代码：

$(".block-category-navigation li[style='margin-left: 15px;']").addClass('sub-menu'); 

它在 Firefox 中运行良好，但在 IE 中根本不起作用。 IE 会忽略样式选择器吗？如果是这样的话，无论如何

【问题讨论】：

如果你有很多带有 "style=margin-left: 15px;" 的列表我会把它放在一个类中，例如 class="margin_left"，然后你这样做 $('li').hasClass('margin_left').addClass('sub-menu');

我不能，使用糟糕的 CMS，因此我使用的方法很糟糕......

【参考方案1】：

在 IE8 的控制台中检查后，我发现它正在将 'margin-left' 变成 'MARGIN-LEFT'。

在 IE 中这个选择器可以工作：

$(".block-category-navigation li[style='MARGIN-LEFT: 15px']").addClass('sub-menu'); 

您可以同时使用大小写选择器，或者使用循环来检查样式属性，如下所示：

$('.block-category-navigation li[style]').each(function() 
    $this = $(this);
    if ($this.attr('style').match(/margin-left: 15px/i)) 
        $this.addClass('sub-menu');
    
);

更新

因为我不想给你不工作的代码，我在这里设置了这个工作示例：http://jsfiddle.net/YB7uV/6/

【讨论】：

我的风格是“float:left”，我尝试了各种大写和空格，但没有成功，但你的每个函数都成功了。谢谢。我认为 jQuery 应该为我们解决这个问题 ;(

【参考方案2】：

您可以将 marginLeft css 属性与 each() 方法一起使用...但不确定是否有更好的方法

$(".block-category-navigation li[style]").each(function()
 if($(this).css("marginLeft") == '15px')
    $(this).addClass("myclass");

);

【参考方案3】：

我们需要查看包含ul 标签的代码以及使用所有样式的样式表。这可能是您处理 CSS 的方式，而不是 jQuery。我会说您的连字符使用令人担忧，尽管正如我之前所说，如果没有全貌，很难诊断。由于您要添加名称中带有连字符的类，因此 jQuery 可能将该类作为属性而不是字符串引用。 Firefox 在处理 javascript 方面更加优雅，因此如果命名关闭，IE 可能会简单地忽略类添加。您也可以尝试将该类从 sub-menu 更改为 submenu，看看 IE 是否运行得更好。