Question

使用jQuery，如何轻松地在函数（此处myFct ）中找出用于选择元素的选择器（此处.foo或{{ 1}} ）？

.bar

更新：有时使用$.fn.myFct = function(){ //print '.foo' OR '.bar' } $('.foo').myFct(); $('.bar').myFct();，有时使用#thisisanid甚至甚至是.thisisaclass

调用元素

Answer 1

在函数内部，this保存元素本身或元素数组（如果多次调用）。

因此，您可以使用内置的className属性来确定在函数内部调用了哪个元素。

$.fn.myFct = function() {
  // Called on multiple elements
  if (this.length) {
    $(this).each(function() {
      console.log(this.className);
    });  
  } 
  // Called on a single element
  else {
    console.log(this.className);
  }
}

$('.foo').myFct();       // foo
$('.bar').myFct();       // bar
$('.foo, .bar').myFct(); // foo & bar

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo"></div>
<div class="bar"></div>

Answer 2

您可以使用较低版本的jQuery（例如1.12.4）中的代码，通过使用.selector

演示：

轻松实现所需的功能。

$(document).ready(function(){

$.fn.myFct = function() {
    console.log($(this).selector);
}


$('.foo').myFct();
$('#bar').myFct();
$('div p span').myFct();
});

<script
  src="https://code.jquery.com/jquery-1.12.4.min.js"
  integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
  crossorigin="anonymous"></script>

<div class="foo"></div>
<div id="bar"></div>
<div><p><span></span></p></div>

找出函数中使用的jQuery选择器

2 个答案: