0

かなり複雑なカスタム要素を作成するクラスに取り組んでいます。要素を作成するときに、要素属性(主にCSS)を定義できるようにしたい。入力配列を指定して属性をすばやく設定するために、次の関数を思いつきました。

// Sample array structure of apply_settings
//var _button_div =   {
//    syle    :   {
//        position:   'absolute',
//        padding :   '2px',
//        right   :   0,
//        top     :   0
//    }
//};
function __apply_settings(__el,apply_settings){
    try{
        for(settingKey in apply_settings){
            __setting = apply_settings[settingKey];
            if(typeof(__setting)=='string'){
                __el[settingKey] = __setting;
            }else{
                for(i in __setting){
                    __el[settingKey][i] = apply_settings[settingKey][i];
                } 
            }
        }
    }catch(ex){
        alert(ex + "   " + __el);
    }
}

この関数は、次の場合を除いて正常に機能します。

function __draw_top(){
    var containerDiv = document.createElement('div');
    var buttonDiv = document.createElement('div');
    __apply_settings(containerDiv,this.settings.top_bar);
    if(global_settings.show_x)
        buttonDiv.appendChild(__create_img(global_settings.images.close));
    containerDiv.appendChild(buttonDiv);
    __apply_settings(buttonDiv,this.settings.button_div);
    return containerDiv;
}

失敗している特定のセクションには__apply_settings(buttonDiv,this.settings.button_div);、「未定義のプロパティ'位置'を設定できません」というエラーがあります。当然のことながら、buttonDivは未定義であると想定していますalert(ex + " " + __el);。__apply_settings()を入力して、作業内容を確認します。驚いたことに、要素はdivです。この関数がbuttonDivではなくcontainerDivで機能する理由はありますか?どんな助けでも大歓迎です:)

{編集} http://jsfiddle.net/Us8Zw/2/

4

1 に答える 1

1

これは、ここにタイプミスがあるためです。

var _button_div =   {
    syle    :   { //<--- here
        position:   'absolute',
        padding :   '2px',
        right   :   0,
        top     :   0
    }
};

に修正するとstyle、正常に機能します。http://jsfiddle.net/Us8Zw/3/

また、(一見自分で作成するのではなく)よく知られているスタイルガイドに従うことをお勧めします。現時点では、コードを読むのは非常に困難です。私がお勧めするのは、Crockfordスタイルガイドです。

于 2012-06-12T10:41:37.940 に答える