jQuery находит дочерние элементы

#jquery

#jquery

Вопрос:

привет, у меня есть вопрос о некоторых jquery, как мне выбрать «Первый-первый» в моей структуре html, когда мышь вводит main? структура html:

 <div id="main">
    <div class="first">
        <div class="first-first"></div>
        <div class="first-second"></div>
    </div>
</div>
  

будет ли это лучшим способом сделать это?

   $("div.main").mouseenter(function() {
        $(this).child(".first").next(".first-first").show();
  }).mouseleave(function() {
        $(this).child(".first").next(".first-first").hide();
  });
  

Комментарии:

1. На самом деле, $(this).find(".first-first").show(); достаточно предположить, что у вас есть только один.

2. @ShadowWizard .find() работает медленно. Ответ Marnix быстрее и имеет тот же эффект.

3. @tandu насколько я знаю, это просто псевдоним, который делает то же самое за кулисами. Можете ли вы доказать обратное?

Ответ №1:

Возможно

 $("#main").mouseenter(function() {
    $('.first-first', this).show();
}).mouseleave(function() {
    $('.first-first', this).hide();
});
  

Ответ №2:

Как насчет использования простого селектора:

 $("div.main").mouseenter(function() {
    $(".first > .first-first", this).show();
});
  

Ответ №3:

Вы близки:

   $("div.main").mouseenter(function() {
        $(this).children(".first").children(".first-first").show();
  }).mouseleave(function() {
        $(this).children(".first").children(".first-first").hide();
  });
  

Или даже быстрее:

   $("div.main").mouseenter(function() {
        $(this).find(".first-first").show();
  }).mouseleave(function() {
        $(this).find(".first-first").hide();
  });
  

Ответ №4:

 $('div#main').mouseenter(function() {
   $("div.first div.first-first", this).show();
}).mouseleave(function() {
     $("div.first div.first-first", this).hide();
});
  

это будет сделано

Ответ №5:

 $("div.main div:first div:first").show();
  

Ответ №6:

Вы можете упростить это. И вам, вероятно, следует использовать наведение курсора мыши, а не mouseenter

  $("div.main").mouseover(function() {
        $(".first-first").show();
  }).mouseleave(function() {
        $(".first-first").hide();
  });
  

Ответ №7:

 $(this).find('.first-first').show();
  

Вы должны использовать find() функцию.