如何知道 jquery 插件中的选择器？答案

【问题标题】：How to know the selector inside jquery plugin?如何知道 jquery 插件中的选择器？
【发布时间】：2020-01-22 16:16:53
【问题描述】：

我已经创建了一个类似的插件

jQuery.fn.Foo = function () { 

    //var str=   get selector some_how; alert(str);      

    //at this point get selector that invoked this function

    //eg:
    /*
         jQuery('.red').Foo(); // alerts .red
         jQuery('#something_else') // alerts  #something_else
    */


}

【问题讨论】：

可能重复：stackoverflow.com/questions/4680498/…

标签： javascript jquery jquery-plugins

【解决方案1】：

jQuery 对象有一个选择器属性。您可以访问this.selector。

【讨论】：

【解决方案2】：

这就是我在 2017 年在插件中获取选择器字符串的方式：

(function($, window, document, undefined) { 
    $.fn._init = $.fn.init
    $.fn.init = function( selector, context, root ) {
        return (typeof selector === 'string') ? new $.fn._init(selector, context, root).data('selector', selector) : new $.fn._init( selector, context, root );
    };
    $.fn.getSelector = function() {
        return $(this).data('selector');
    };
    $.fn.coolPlugin = function() {
        var selector = $(this).getSelector(); 
        if(selector) console.log(selector); // outputs p #boldText
    }
})(jQuery, window, document);

// calling plugin
$(document).ready(function() {
    $("p #boldText").coolPlugin();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>some <b id="boldText">bold text</b></p>

这个想法是根据是否提供选择器字符串有条件地包装 jQuery 的 init() 函数。如果提供，则使用jQuery的data()方法将选择器字符串与最终调用的原始init()相关联。小getSelector() 插件只需要以前存储的值。稍后可以在您的插件中调用它。它应该适用于所有 jQuery 版本。

【讨论】：

可能jquery 3.0以下的版本没必要用这个技巧，但是，3.0以上非常有用。谢谢。