无法设置未定义的 - 以编程方式创建的元素的属性 X

Cannot set property X of undefined - programatically created element

本文关键字：创建 方式 元素 属性 编程 设置 未定义      更新时间：2023-09-26

我正在研究一个类来创建相当复杂的自定义元素。我希望能够在创建元素时定义元素属性（主要是 CSS）。我想出了以下函数来快速为我设置输入数组的attrs：

// 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。有什么理由为什么这个函数适用于容器Div而不是按钮迪夫？任何帮助将不胜感激:)

{编辑}http://jsfiddle.net/Us8Zw/2/

那是因为你这里有一个错字：

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

如果将其更正为 style ，则工作正常; http://jsfiddle.net/Us8Zw/3/

我还建议你尝试遵循一个众所周知的风格指南（而不是看似自己编造）;你的代码目前很难阅读。我推荐的一个是Crockford Style Guide。

相关文章：