2

私は少し遅れていることを知っていますが、javascriptモジュールパターンに出くわしました. を使用していくつかのプロジェクトを書き直していますが、以下のコードの効率について疑問に思っていました。これは、特定の要素の CSS を更新する非常に基本的なスクリプトです。

/*---- CSS Styling Functions ----*/
$(document).ready(function() { cssStyler.init('breadcrumbs');});

$(".toggle_category").click(function(){ cssStyler.init('label');});

var cssStyler = {       

    breadcrumbs: {
        id: $("#category_id").val(),
        id2: $("#art_id").val(),
        attr: "color",
        tag: "#CD661D",
    },

    label: {
        id: "alert_request",
        attr: "display",
        tag: "block",
        tag2: "none"
    },

init: function(config) {

    elems = new Array();
    elems[0] = $('#'+cssStyler[config].id)[0];
    elems[1] = $('#'+cssStyler[config].id2)[0];

    for (var i = 0; i < elems.length; i++) {    
        if(elems[i]){
            if (elems[i].style[cssStyler[config].attr] != cssStyler[config].tag) {
                elems[i].style[cssStyler[config].attr] = cssStyler[config].tag; 
                }
            else {
                elems[i].style[cssStyler[config].attr] = cssStyler[config].tag2;
                }
            }}
    }   
};

});

ご覧のとおり、ページ上の要素を取得し、CSS を変更します。ブレッドクラムはページの準備ができた状態で実行され、クリックするとラベルが非表示/非表示になります。

これまでモジュールに実際に触れたことがない私の懸念は、効率性です。'config' を 2 つ用意して、渡された変数に応じて関数を実行しても問題ありませんか? 物事を行うためのより良い方法はありますか?

改善のための推奨事項をいただければ幸いです。それが完全なゴミならそう言ってください、それは私の気持ちを傷つけることはありません-私は約束します.

4

0 に答える 0