如何将 jQuery 选择器的表达式作为文本获取?

Posted

技术标签:

【中文标题】如何将 jQuery 选择器的表达式作为文本获取?【英文标题】:How do I get a jQuery selector's expression as text? 【发布时间】:2010-10-04 18:07:42 【问题描述】:

我有一个 jQuery 选择器,它有一个链式函数。

在函数内部,我想访问代表选择器表达式的 TEXT。

$("cat dog").function() 

    // how do I get access to the "cat dog" string from inside THIS function ?
;

我在这个代码示例中过度简化了我真正想做的事情。我正在编写一个插件,我需要访问已为其创建包装集的选择器。显然,在这个特定的例子中,我可以使用“猫狗”,因为我写了它。所以想象一下这是在一个插件中。

Google 有点棘手。

编辑: 'selector' 属性现在已被弃用。 http://jquery.com/upgrade-guide/1.9/#selector-property-on-jquery-objects

【问题讨论】:

即使您可以访问初始选择器,请记住您可能有类似 $(".cat .dog").parents("div:first").find(".parrot" ).each(function()/*...*/);您根本没有简单的选择器。 这是我正在努力解决的问题。我可能想知道遍历树,但大多数情况下只获取最后一个元素就可以了。我通常想做这样的事情 $('.cat').assertNonEmpty().each(function()); 有没有机会升级到 jQuery 1.3.1 并使用“选择器”? 我正在等待 1.3.2 - ***.com/questions/498469。我明天必须在一个新网站的一小部分上线,我不希望人们在 jQuery 执行之前必须等待图像加载。一旦我确认 1.3.2 没有错误,我就会切换。感谢您的信息 【参考方案1】:

jQuery 对象中有一个“选择器”属性,但我不确定它是否始终可用。

【讨论】:

我尝试时似乎无法访问它。我会再等一会儿,看看是否有人愿意为我试一试:) 它在 1.3.1 中的新功能 如果您使用 1.2.6,它将不可用 哦,太好了。谢谢,我会检查一下。由于这个***.com/questions/477463,我不会切换到 jQuery,直到官方 1.3.2 版本发布(顺便说一下,到目前为止,这篇文章让我获得了最多的分数!) “选择器”是记录在案的属性吗?如果它是无证财产,我不会依赖它。我在 jquery docs 中找不到任何对它的引用。 现已弃用 :-( jquery.com/upgrade-guide/1.9/…【参考方案2】:

这远非最佳,但在某些情况下有效。您可以执行以下操作:

jQuery.fn._init = jQuery.fn.init
jQuery.fn.init = function( selector, context ) 
    return (typeof selector === 'string') ? jQuery.fn._init(selector, context).data('selector', selector) : jQuery.fn._init( selector, context );
;

jQuery.fn.getSelector = function() 
    return jQuery(this).data('selector');
;

这将返回用于元素的最后一个选择器。但它不适用于不存在的元素。

<div id='foo'>Select me!</div>
<script type='text/javascript'>
 $('#foo').getSelector(); //'#foo'
 $('div[id="foo"]').getSelector(); //'div[id="foo"]'
 $('#iDoNotExist').getSelector(); // undefined
</script>

这适用于 jQuery 1.2.6 和 1.3.1 以及可能的其他版本。

还有:

<div id='foo'>Select me!</div>
<script type='text/javascript'>
 $foo = $('div#foo');
 $('#foo').getSelector(); //'#foo'
 $foo.getSelector(); //'#foo' instead of 'div#foo'
</script>

编辑 如果您在使用选择器后立即检查,您可以在插件中使用以下内容:

jQuery.getLastSelector = function() 
    return jQuery.getLastSelector.lastSelector;
;
jQuery.fn._init = jQuery.fn.init
jQuery.fn.init = function( selector, context ) 
    if(typeof selector === 'string') 
        jQuery.getLastSelector.lastSelector = selector;
    
    return jQuery.fn._init( selector, context );
;

然后以下将起作用:

<div id='foo'>Select me!</div>
<script type='text/javascript'>
 $('div#foo');
 $.getLastSelector(); //'#foo'
 $('#iDoNotExist');
 $.getLastSelector(); // #iDoNotExist'
</script>

在你的插件中你可以这样做:

jQuery.fn.myPlugin = function()
 selector = $.getLastSelector;
 alert(selector);
 this.each( function() 
  //do plugins stuff
 


$('div').myPlugin(); //alerts 'div'
$('#iDoNotExist').myPlugin(); //alerts '#iDoNotExist'

但还是:

$div = $('div');
$('foo');
$div.myPlugin(); //alerts 'foo'

【讨论】:

哈哈。那真的很聪明。不幸的是,我确实需要(实际上往往不是)知道选择器何时返回零项。我正在尝试为我的断言插件***.com/questions/498469 构建更有用的错误消息 - Simon 我现在还不够清醒,无法重新阅读这篇文章。我只是看到你更新了这个。只是想引起对使用此代码的任何人的注意,如果他们看到一些奇怪的事情发生,这可能是由于这个问题:***.com/questions/535967【参考方案3】:

如果您使用的是萤火虫,您可以在函数内部console.log(this) 并查看选择器字符串是否可以在对象中的某处访问。抱歉,我不熟悉 jQuery API。

【讨论】:

我似乎无法立即看到它,但 +1 告诉我一些我不知道的事情。我在 Visual Studio 中使用 IE 和调试,但通过检查那里的对象并没有多大用处 大声笑!谢谢你的提示。忘记在函数中转储 this 变量。 :) 在这里节省了我的时间!! :) 谢谢!! 在IE中自动调试?哇,这有点自虐;-)【参考方案4】:

如果您想在函数中访问选择器字符串,这将起作用:

$(this).html();

如果使用多个选择器,这也将起作用,

例如,

$('#id1,#id2').click(function()
   alert($(this).html());
);

【讨论】:

【参考方案5】:

也许这能解决你的问题:

var $jqueryItems = $( ".my-selector" );
console.log( $jqueryItems.selector ); // display ".my-selector"

【讨论】:

【参考方案6】:

对于那些想要了解他们提供给 jQuery 的插件选择器字符串的人,我很高兴改进了@Pim Jager 给出的出色答案:

    截至目前(最新版本 3.2.1)jQuery.fn.init 中有 3 个参数 功能 - selector, context, root - 不是两个; new 关键字应该添加到返回语句中 jQuery.fn.init; 在您的插件中,选择器通过调用以字符串形式返回 $(this).getSelector();

最后,这就是我必须像魅力一样为我工作:

(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.YOUR-PLUGIN = function() 
        var selector = $(this).getSelector(); // selectors string given to jQuery 
        // other code
    
)(jQuery, window, document);

就我而言,它适用于 jQuery 版本(从 1.7.0 到 3.2.1)。

附言。即使使用 *** 上的 jQuery 1.2.3 也可以正常工作。所以,我想,如果你想在插件中获取一个 jQuery 选择器的表达式作为文本,那么对于所有 jQuery 版本都可以:

// our plugin
(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/1.2.3/jquery.min.js"></script>
<p>some <b id="boldText">bold text</b></p>

【讨论】:

【参考方案7】:

请参考我对重复问题的回答: Intercepting selector at initialization time

详情: 即使在弃用和删除“selector”属性后也可以完全使用任何 jQuery 版本

我的解决方案是在 jQuery 对象初始化时拦截选择器,同时使用继承透明地维护所有其他 jQuery 功能,如下所示:

$ = (function (originalJQuery) 

    return (function () 
    
        var newJQuery = originalJQuery.apply(this, arguments);
        newJQuery.selector = arguments.length > 0 ? arguments[0] : null;
        return newJQuery;
    );
)($);

$.fn = $.prototype = jQuery.fn;

用法:

var myAnchors = $('p > a');
var selector = myAnchors.selector;

应该产生:"p &gt; a"

使用 jQuery 3.4.1 成功尝试

【讨论】:

【参考方案8】:

当绑定到函数时,我无法弄清楚如何获取对 $('value_i_want_here') 内部提供的选择器的字符串值的引用;似乎是一个棘手的问题。但是,如果您更喜欢在 IE[x] 中进行测试,总有 Firebug Lite 可以很好地使用 console.log(var|val)。

【讨论】:

【参考方案9】:

好吧,我仍然想知道您是否要获取元素名称?或 id 和/或 class 或全部。

你可以用这个获取元素

var 元素 =$(this).get(0); var id = $(this).attr('id'); var class=$(this).attr('class');

不知道如果你有不止一门课会发生什么。可能会进入一个数组或其他东西,你可以通过索引得到它。

【讨论】:

@pedalpete - 我想要那个实际的文本“猫狗” - 作为一个字符串 @pedalpete - 我认为这篇文章的标题可能有点误导,但我希望问题本身更清楚。有点暧昧的看着它。我想要的是构建 $('cat dog') 选择器的实际字符串值。 哈哈。那真的很聪明。不幸的是,我确实需要(实际上往往不是)知道选择器何时返回零项。我正在尝试为我的断言插件***.com/questions/498469 构建更有用的错误消息 对不起 - 我实际上发布了关于错误答案的最后一条评论。这不是我要找的

以上是关于如何将 jQuery 选择器的表达式作为文本获取?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用获取的变量作为材料 UI 日期选择器的初始状态?

JQuery 在嵌套元素上查找没有选择器的文本节点仅适用于 .contents() 和 filter()

jQuery:如果 DatePicker UI 更改,则更新某个文本框

UIPickerView 作为按钮操作并根据选择器的选定值设置文本字段的文本

史上最全的jQuery选择器

使用 Jquery 在选择器的结果中搜索