创建自己的JQuery插件

Question

I want to create a very simple Jquery Plugin. What it does is return the parent of the element. I searched and tried many different methods, still can't get it to run.

(function($){
$.fn.extend({
    getParent:function(){

        return this.each(function(){$(this).parent()}); 

    }


    });
})(JQuery);

in html

<script type="text/javascript">
    $(document).ready(function(e) {
alert($("#demos").getParent());
    });
</script>

it should alert the parent of the $("#demos")

Answer 1

You have typo here:

Replace JQuery with jQuery .

(function($){
$.fn.extend({
    getParent:function(){
        return this.each(function(){$(this).parent()}); 
    }
    });
})(jQuery);

$(document).ready(function() {
console.log($("#demos").getParent());
});

<div id="parent">
    <div id="demos"></div>
</div>

DEMO

Answer 2

You have a typo in your plugin. It's jQuery , not JQuery .

(function($){
$.fn.extend({
    getParent:function(){

        return this.each(function(){$(this).parent()}); 

    }


    });
})(jQuery);

Answer 3

JQuery this.each() returns just the items in this . So you will not get the parents by doing an each but only the selected item again.

If you would do just...

 return $(this).parent();

...you would get what you want.