修改尚未创建的元素的最佳方法

您需要在加载文档后运行脚本。使用jQuery,您可以使用:

$(document).ready(function () {
    //do stuff here
});

我不知道您在使用哪个库,但它们都有一个jQuery的文档就绪的等价物。

以下是等效的原型:

document.observe("dom:loaded", function() {
  // do stuff
});

试着把你的代码放进去 load 事件:

$(window).load(function(){
  $("#xxx").fooBar = function() { ... };
});

如果代码必须直接在输入之前,您可以检查它是否在一段时间后加载。

<script type="text/javascript">
    //Sets up a function to execute once the input is loaded
    f = function () 
        {
        //Checks if 'xxx' exists (may vary between frameworks)
        if ($("xxx") !== undefined) 
            {
            $("xxx").fooBar = function() { ... };
            //Escapes the timer function, preventing it from running again
            return true;
            }
        //If still not loaded check again in half a second (0.5s or 500ms)
        setTimeout(f,500);
        return false;
        }
    f();//Initialize the timer function
</script>
<input id="xxx" .../>

与其向dom节点添加一个方法,为什么不将其作为一个单独的函数,因此

$("xxx").fooBar = function() {
  doStuff(this); 
}; 

你会有类似的

function xxx_fooBar () {
  var me = document.getElementById('xxx');
  doStuff(me);
};

另一个建议是:如果您可以添加属性到 <input>

<script>
function xxx_init (e) {
  e.fooBar = function () {
    doStuff(this); 
  };
} 
</script>
<input onload="xxx_init(this)" id="xxx" .../>

或者您可以按照其他人的建议,将脚本附加到window.onload文件事件。