Question

有一个带有结构的html页面：

<div class="row sem">
 <div class="subject"><h3>A</h3></div>
 <div class="subject"><h3>B</h3></div>
</div>
<div class="row sem">
 <div class="subject"><h3>C</h3></div>
 <div class="subject"><h3>D</h3></div>
</div>

我在最上面的div附加了一个悬停事件：

$(".row.sem").hover(function(){
//my code....
});

现在，当我将鼠标悬停在其中一个div上时，我想访问仅在我悬停的div元素中的那些h3元素的内部内容。

为此，我试过了：

var a = $(this).children(["h3"]);
 for(ei in ee){                
   console.log(ei);     
  }

但是，这打印了很多东西，比如 fadein，fadeout，scroll ... 。这个对象不包含悬停div的内部标签。

请说明此实施中的错误。

感谢。

Answer 1

当您正在寻找.children()时，

h3会收集直接子元素。因此，您可以使用.find()方法甚至（更具体）.children('.subject').children('h3')。

$(".row.sem").hover(function(){
  // mouse enter
  var a = $(this).find("h3");
  a.each(function(){
    console.log($(this).text());
  });
}, function(){
    // mouse leave
    console.clear();
    // ...
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row sem">
 <div class="subject"><h3>A</h3></div>
 <div class="subject"><h3>B</h3></div>
</div>
<div class="row sem">
 <div class="subject"><h3>C</h3></div>
 <div class="subject"><h3>D</h3></div>
</div>

请参阅：https://api.jquery.com/children/

Answer 2

这将获取h3元素的.row.sem子元素的内容。你需要得到你正在盘旋的div的所有孩子。您可以使用.html()访问和修改这些孩子的html内容，我建议您查看该方法。

$(".row.sem").hover(
  function() {
    console.log($(this).children().text());
  }, function (){}
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row sem">
 <div class="subject"><h3>A</h3></div>
 <div class="subject"><h3>B</h3></div>
</div>
<div class="row sem">
 <div class="subject"><h3>C</h3></div>
 <div class="subject"><h3>D</h3></div>
</div>

Answer 3

清晰简单。

＆＃13;

$(".row.sem").hover(function() {
  $(this).find("h3").each(function() {
    console.log($(this).text());
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row sem">
 <div class="subject"><h3>A</h3></div>
 <div class="subject"><h3>B</h3></div>
</div>
<div class="row sem">
 <div class="subject"><h3>C</h3></div>
 <div class="subject"><h3>D</h3></div>
</div>

＆＃13;

Answer 4

如果您检查MDN文档for in loop，则说明它会覆盖＆＃34;可枚举的属性＆＃34;。请查看此帖子enumarable properties

检查一下。

＆＃13;

     index   Sent   col_1   col_2   col_3
        1   AB        F       DD     CC
        1             0       1       0
        2   SA        FA      FB      NaN
        2             1       1       NaN
        3   FF       Sha      F       PA
        3             1       0       1

This is my code:
for col in ['col_1', 'col_2', 'col_3']:
    data = np.reshape(df[col].values, (-1, 2))
    need_fill = np.logical_and(data[:, 0] == '', data[:, 1] != '')
    data[np.where(need_fill),1] = 'F'

＆＃13;

$(".row.sem").hover(function(){

  // i am list of all headers nested inside element with class "row" and "sem"
  //  elements(array)
  var headers = $(this).find('h3');
   
   // console first element's html from the array.
   console.log($(headers[0]).html())
  

});

＆＃13;

如何通过Jquery访问正确的标签

4 个答案: