替代javascript中的多个if else语句

Question

我的问题非常类似于Reduce multiple if语句

我有多个if else语句,我想使用jquery每个函数来使代码更有效,但我无法弄清楚如何做到这一点.

我在wordpress中运行jQuery,我相信在noconflict模式下运行,所以我不能得到更多(我考虑的)高级主题,这些主题为我提供了示例,因为我无法理解正确的功能要使用的语法.

如果有人可以帮助并解释如何为我做这将是惊人的.这是我的代码:

var $h6p = $("h6 + p");
var $h5p = $("h5 + p");
var $h4p = $("h4 + p");
var $h3p = $("h3 + p");
var $h2p = $("h2 + p");
var $h1p = $("h1 + p");
var $fullercolor_bg = "rgba(240,234,222,0.9)";

if($h1p.mouseIsOver()) {
    $h1p.prev().css("background-color", $fullercolor_bg);
} else {
    $h1p.prev().css("background-color", "");
}
if($h2p.mouseIsOver()) {
    $h2p.prev().css("background-color", $fullercolor_bg);
} else {
    $h2p.prev().css("background-color", "");
}
if($h3p.mouseIsOver()) {
    $h3p.prev().css("background-color", $fullercolor_bg);
} else {
    $h3p.prev().css("background-color", "");
}
if($h4p.mouseIsOver()) {
    $h4p.prev().css("background-color", $fullercolor_bg);
} else {
    $h4p.prev().css("background-color", "");
}
if($h5p.mouseIsOver()) {
    $h5p.prev().css("background-color", $fullercolor_bg);
} else {
    $h5p.prev().css("background-color", "");
}
if($h6p.mouseIsOver()) {
    $h6p.prev().css("background-color", $fullercolor_bg);
} else {
    $h6p.prev().css("background-color", "");
}

(如果CSS有一个先前相邻的兄弟选择器,那么此时我会越过月球.)

编辑:感谢您的帮助到目前为止,我应该提到的一件事是else语句的空白设置是故意的.我已经使用CSS来定位兄弟选择器,并设置了背景颜色,所以我需要设置它.不透明.

Answer 1

也许你可以通过使用:header选择器来做这样的事情.

$(':header + p').each(function () {
    var $this = $(this);

    $this.prev().css({
        backgroundColor: $this.mouseIsOver()? 'rgba(240,234,222,0.9)' : 'transparent'
    });
});