Javascript 编写正确的jQuery插件有困难

我正在重写jQuery插件，以便在实习期间构建的RSS阅读器中使用。该插件使用Google的FeedAPI提取JSON格式的RSS提要并将其返回给开发人员，允许开发人员对该提要在网页上的显示方式进行微调控制。我一直在关注官方页面作为参考

在参考页面上，代码示例说明需要将插件添加到jQuery的原型中：

$.fn

。以下是我所做的：

(function($) {
    "use strict";

    $.fn.rssObj = function(newUrl) {
        var RSSFeed = function(newUrl) {
            /*
             * An object to encapsulate a Google Feed API request.
             */

            this.feedUrl = newUrl;
        };

        RSSFeed.prototype.load = function() {
            var feed = new google.feeds.Feed(this.feedUrl);
            feed.load(function(result) {
                console.log(result);
            });
        };

        return new RSSFeed(newUrl);
    };

})(jQuery);

当我试图通过执行

$.rssObj（“http://rss.test.com“”

，我的浏览器显示此错误：

$.rssObj() is not a function

---

我做错了什么？

如果希望函数在jQuery实例上可用（例如，从

$返回的对象（“您的选择器”）

等），则添加到

$.fn

。如果希望函数直接从

$

对象中可用，可以直接将其添加到该对象中

以下是一个示例，分别显示了：

//创建插件
（函数（$）{
//这将在*实例上进行*
$.fn.green=函数（）{
//`this`是调用我们的jQuery实例
返回此.css（“颜色”、“绿色”）；
};
//这将在$/jQuery对象本身上
$.blue=函数（选择器）{
//你不能在这里使用'this'（如果你愿意，你可以，
//它将是==$/jQuery，但没有理由这样做）
$（选择器）.css（“颜色”、“蓝色”）；
归还这个；
};
})（jQuery）；
//用法
jQuery（函数（$）{
//使用边框将所有div设置为绿色
$（“div”）.green（）.css（“边框”，“1px纯绿色”）；
//使所有段落都变成蓝色
元蓝(p);；
});
我是一个div
我是一个段落

如果希望函数在jQuery实例（例如，从
$返回的对象（“此处的选择器”）
等）上可用，可以添加到
$.fn
。如果希望函数直接从
$
对象中可用，可以直接将其添加到该对象中

以下是一个示例，分别显示了：


//创建插件
（函数（$）{
//这将在*实例上进行*
$.fn.green=函数（）{
//`this`是调用我们的jQuery实例
返回此.css（“颜色”、“绿色”）；
};
//这将在$/jQuery对象本身上
$.blue=函数（选择器）{
//你不能在这里使用'this'（如果你愿意，你可以，
//它将是==$/jQuery，但没有理由这样做）
$（选择器）.css（“颜色”、“蓝色”）；
归还这个；
};
})（jQuery）；
//用法
jQuery（函数（$）{
//使用边框将所有div设置为绿色
$（“div”）.green（）.css（“边框”，“1px纯绿色”）；
//使所有段落都变成蓝色
元蓝(p);；
});
我是一个div
我是一个段落

查看我在哪里做了作者想要做的事情我只是使用了我使用多年的模板：

(function($) {
    if (!$.myExample) { // check your plugin namespace does not already exist
        $.extend({  //  this will allow you to add your plugin to the jQuery lib
            myExample: function(elm, command, args) {
                //  keep in mind, right here you might want to do a class or data check to determine which direction this call is going
                //  for example, upon init the plugin on an element you may add the plugin name as a class, 
                //      this way, when it's recalled, you can see it alrady has that class and might be calling a command,
                //          thus make an if statemnt to push the process through
                return elm.each(function(index){
                    // do work to each element as its passed through
                    // be sure to use something like
                    //    return elm.each(function(e) { dor work });
                    // as your final statement in order to maintain "chainability"
                });
            }
        });
        $.fn.extend({   //  this gives the chainability functionality seen with $ funcs like: $("#eleID").css("color", "red") <--returns original element object
            myExample: function(command) {
                return $.myExample($(this), command, Array.prototype.slice.call(arguments, 1));
            }
        });
        $.myExample.props = {   //  Here you can establish specific properties to your plugin, prehaps even make them "Over-writable"
            key1: "value",
            key2: "value"
        };
        $.myExample.methods = { //  Here you can establish specific methods/functions for your plguin to carry out and maintain your namespace as well
            key1: function(param) {
                /*  do work */
            },
            key2: function(param) {
                /*  do work */
            }
        };
        //  This next part is not seen in many plugins but useful depending on what you're creating
        $.myExample.init = function(param) {    //  If you have an initialize method to apply, namespace it in here and calll on initializing your plugin
            var key = "value",
                key2 = {
                    subKey: "value"
                };
                /*
                /  run any number of initializing functions here
                /  I prefer to make my param a value that can be a
                /   string with a possible object
                /   the string for holding a base configuration
                /   the object for any change in properties or base values for that config
                */
        };
        $.myExample.defaults = {    //  establish base properties here that can be over-written via .props, but their values should never truly change
            key1: "value",
            key2: {
                prop1: {
                    subKey1: "value",
                    subKey2: "value"
                },
                prop2: {
                    subKey1: "value"
                }
            },
            key3: function(param) {

            }
        };
    }
})(jQuery);

（函数（$）{
如果（！$.myExample）{//检查您的插件名称空间不存在
$.extend（{//这将允许您将插件添加到jQuery库
myExample:function（elm、command、args）{
//请记住，此时您可能需要执行类或数据检查，以确定调用的方向
//例如，在初始化元素上的插件时，可以将插件名称添加为类，
//这样，当调用它时，您可以看到alrady拥有该类并且可能正在调用命令，
//因此，做出一个if声明来推动流程
返回elm.each（函数（索引）{
//在每个元素通过时对其进行处理
//一定要使用类似于
//返回elm.each（函数（e）{dor work}）；
//作为您的最终声明，以保持“链接性”
});
}
});
$.fn.extend（{//这提供了$funcs的可链接性功能，如：$（“#eleID”）.css（“颜色”、“红色”）查看我在哪里做了作者想要做的事情我只是使用了多年来一直使用的模板：

(function($) {
    if (!$.myExample) { // check your plugin namespace does not already exist
        $.extend({  //  this will allow you to add your plugin to the jQuery lib
            myExample: function(elm, command, args) {
                //  keep in mind, right here you might want to do a class or data check to determine which direction this call is going
                //  for example, upon init the plugin on an element you may add the plugin name as a class, 
                //      this way, when it's recalled, you can see it alrady has that class and might be calling a command,
                //          thus make an if statemnt to push the process through
                return elm.each(function(index){
                    // do work to each element as its passed through
                    // be sure to use something like
                    //    return elm.each(function(e) { dor work });
                    // as your final statement in order to maintain "chainability"
                });
            }
        });
        $.fn.extend({   //  this gives the chainability functionality seen with $ funcs like: $("#eleID").css("color", "red") <--returns original element object
            myExample: function(command) {
                return $.myExample($(this), command, Array.prototype.slice.call(arguments, 1));
            }
        });
        $.myExample.props = {   //  Here you can establish specific properties to your plugin, prehaps even make them "Over-writable"
            key1: "value",
            key2: "value"
        };
        $.myExample.methods = { //  Here you can establish specific methods/functions for your plguin to carry out and maintain your namespace as well
            key1: function(param) {
                /*  do work */
            },
            key2: function(param) {
                /*  do work */
            }
        };
        //  This next part is not seen in many plugins but useful depending on what you're creating
        $.myExample.init = function(param) {    //  If you have an initialize method to apply, namespace it in here and calll on initializing your plugin
            var key = "value",
                key2 = {
                    subKey: "value"
                };
                /*
                /  run any number of initializing functions here
                /  I prefer to make my param a value that can be a
                /   string with a possible object
                /   the string for holding a base configuration
                /   the object for any change in properties or base values for that config
                */
        };
        $.myExample.defaults = {    //  establish base properties here that can be over-written via .props, but their values should never truly change
            key1: "value",
            key2: {
                prop1: {
                    subKey1: "value",
                    subKey2: "value"
                },
                prop2: {
                    subKey1: "value"
                }
            },
            key3: function(param) {

            }
        };
    }
})(jQuery);

（函数（$）{
如果（！$.myExample）{//检查您的插件名称空间不存在
$.extend（{//这将允许您将插件添加到jQuery库
myExample:function（elm、command、args）{
//请记住，此时您可能需要执行类或数据检查，以确定调用的方向
//例如，在初始化元素上的插件时，可以将插件名称添加为类，
//这样，当调用它时，您可以看到alrady拥有该类并且可能正在调用命令，
//因此，做出一个if声明来推动流程
返回elm.each（函数（索引）{
//在每个元素通过时对其进行处理
//一定要使用类似于
//返回elm.each（函数（e）{dor work}）；
//作为您的最终声明，以保持“链接性”
});
}
});
$.fn.extend（{//这提供了$funcs的可链接性功能，比如：$（“#eleID”）.css（“color”，“red”）ooooohhh，这非常有意义。我试图改变标准jQuery对象的行为，而不是创建静态函数（因为缺少更好的术语）。谢谢你的回答和澄清！@Zach:不用担心，很高兴这有帮助。最好的，这很有意义。我试图改变标准jQuery对象的行为，而不是创建静态函数（因为没有更好的术语）.谢谢你的回答和澄清！@Zach:不用担心，很高兴这有帮助。最好，