Question

我有一个jQuery函数，可以为页面中的许多元素重新调整font-size和line-height的大小，包括p和p.latest_news。 除了p.latest_news

之外，该函数与所有其他元素一起按预期工作

应用于p.latest_news的font-size和line-height等于p no class（即$('p').css({...）

jQuery.1.7.1

CODE

    $('p.article_news').css({
            'font-size' : Math.max(11,(.9 * newFontSize)),
            'line-height' : Math.max(13,(1.1 * newFontSize))+'px'
            });
    $('p').css({
            'font-size' : Math.max(14,newFontSize),
            'line-height' : Math.max(21,(1.7 * newFontSize))+'px'
            });

如果我只使用

    $('p.article_news').css({
            'font-size' : Math.max(11,(.9 * newFontSize)),
            'line-height' : Math.max(13,(1.1 * newFontSize))+'px'
            });

p.article_news字体大小和行高改变如预期

为什么会这样？我怎样才能影响每个p，class和classless？

谢谢

Answer 1

您正在设置article_news字体大小，然后使用第二个选择器再次更改它。

您需要的是：

$('p.article_news').css({
        'font-size' : Math.max(11,(.9 * newFontSize)),
        'line-height' : Math.max(13,(1.1 * newFontSize))+'px'
        });
$('p:not(.article_news)').css({
        'font-size' : Math.max(14,newFontSize),
        'line-height' : Math.max(21,(1.7 * newFontSize))+'px'
        });

：not（）选择器基本上选择所有没有类.active_news的p节点。

Answer 2

只需翻转你的功能。首先使用带有p选择器的函数，然后使用带有p.article_news选择器的函数。

你的p选择器功能正在覆盖p.article_news选择器功能。

Answer 3

我喜欢马克的解决方案。

但如果两个函数一起调用，你可以翻转它们并让它们工作。

$('p').css({
            'font-size' : Math.max(14,newFontSize),
            'line-height' : Math.max(21,(1.7 * newFontSize))+'px'
            });
$('p.article_news').css({
            'font-size' : Math.max(11,(.9 * newFontSize)),
            'line-height' : Math.max(13,(1.1 * newFontSize))+'px'
            });

可能比使用:not

检查更快

Answer 4

由于所有p.article_news都是p，您在p.article_news设置样式时会覆盖在p中添加的样式。您可以先为p设置样式，然后设置p.article_news的样式，也可以使用p:not(.article_news)代替p。

jQuery .css不适用于p和p.class

4 个答案: