如何从普通的 JavaScript 函数中调用基本的 YUI3 函数？答案

【问题标题】：How do I call a basic YUI3 function from within a normal JavaScript function?如何从普通的 JavaScript 函数中调用基本的 YUI3 函数？
【发布时间】：2010-06-11 02:16:42
【问题描述】：

我想从 JavaScript 函数中调用一个简单的 YUI3 函数。这是一些以非常冗长的方式完成我想要的代码：

function changeContent (message) {
    YUI().use("node", function(Y) {
        Y.all('#content-div').setContent(message);
    });
}

有没有更好的方法来做到这一点？

注意：我不想将此函数附加到任何事件，我只想要一个可用的全局 changeContent() 函数。

【问题讨论】：

标签： yui yui3

【解决方案1】：

如果您希望 API 存在于 YUI().use(...function (Y) { /* 沙箱 */ }) 之外，您可以从 YUI() 中捕获返回的实例。

(function () { // to prevent extra global, we wrap in a function
    var Y = YUI().use('node');

    function changeContent(message) {
        Y.one('#content-div').setContent(message);
    }

    ...
})();

请注意，如果您使用种子文件 (yui-min.js) 和动态加载器来拉入其他模块，则会出现竞争条件。可以在加载 Node API 并将其添加到 Y 之前调用 changeContent。您可以通过预先使用组合脚本来避免这种情况。您可以从the YUI 3 Configurator 获取组合脚本 url。预先以阻塞方式加载模块会降低性能。您可能会或可能不会在您的应用程序中注意到这一点。

【讨论】：

【解决方案2】：

你可以这样做：

(function(){
    YUI().use("node", function(Y) {
         APP = {
    changeContent: function(message){
        Y.all('.content-div').setContent(message);      
    }
         };
    });
})();

然后，您可以在任何您想要的地方调用APP.changeContent(message); 来调用changeContent。希望这可以帮助。 :D

【讨论】：