0

これを書くより良い方法はありますか？if ステートメントを何らかの方法で組み合わせることができるようです。

ここにHTMLがあります

<header class="gray_bg" id="main_header">

このヘッダータグのクラス名を変更するために、このコードを書きました。それはうまく機能しますが、もっと短くてもいいような気がします。私はまだ JS/jQuery を学んでいるので、何か助けていただければ幸いです。ありがとう！

$("nav#main_nav li a").on('click', function(){
    var link = $("nav#main_nav li a").index(this);
    var banner = $("header#main_header");

    if (link === 0) {
        banner.attr('class', "gray_bg");
    }

    if (link === 1) {
        banner.attr('class', "orange_bg");
    }

    if (link === 2) {
        banner.attr('class', "green_bg");
    }

    if (link === 3) {
        banner.attr('class', "purple_bg");
    }
});
4

2 に答える 2

4 
$("nav#main_nav li a").on('click', function(){
    var link = $("nav#main_nav li a").index(this);
    var colors = ["gray_bg", "orange_bg", "green_bg", "purple_bg"];

    $("header#main_header").attr('class', colors[link]);
});
于 2013-07-18T02:54:25.797 に答える
1

クラスを配列に入れて、取得したインデックスで読み取るだけです

var classes = ["gray_bg" ,"orange_bg","green_bg" ,"purple_bg"];
$("nav#main_nav li a").on('click', function(){
    var link = $("nav#main_nav li a").index(this);
    var banner = $("header#main_header");


    banner.attr('class', classes[link]);

});
于 2013-07-18T02:55:23.240 に答える