Question

以下是示例： -

HTML

<div id="div1">
   <span id="span1"></span>
</div>

JS

$('#div1').click(function () {
  $(this + "#span1").css("background-color","red");
});

我试过这个，但它没有用。欢迎任何帮助和建议。谢谢。

Answer 1

在您的代码this + "#span1"输出中，例如[object HTMLDivElement]#span1，它们不会选择任何元素，因此您的代码不会发生任何事情。

要在单击的上下文中获取元素，请将this上下文作为jQuery中的第二个参数传递。

$('#div1').click(function () {
  $("#span1", this).css("background-color","red");
});

<小时/> 仅供参考：由于id选择器和id都是唯一的$("#span1")，因此您的代码就足够了。

UPDATE：因此，如果有多个元素，则应使用该类，否则只会选择id的第一个元素。

$('.div1').click(function() {
  $(".span1", this).css("background-color", "red");
});

$('.div1').click(function() {
  $(".span1", this).css("background-color", "red");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="div1">
  <span class="span1">1</span>
</div>
<div class="div1">
  <span class="span1">2</span>
</div>
<div class="div1">
  <span class="span1">3</span>
</div>

我们可以为$（this）添加更多的类选择器吗？

1 个答案: