如何在元素中查找元素

Question

我正在尝试更改父a标记的hover函数中li标记的字体颜色。

我正在尝试做这样的事情

$('li').mouseover(function () {
   var a = $(this).(NEED TO FIND CORRESPONDING a TAG)
    a.css('color', 'white');
});

Answer 1

$(this).find('a');

这会在<a>元素中找到<li>元素。

更好：

$('li a').mouseover(function () {
   var a = $(this); // this now refers to <a>
    a.css('color', 'white');
});

明智地使用选择器可以避免额外的函数调用来节省时间。

更好的是，在父<ul>标记中仅使用单个事件侦听器来处理事件。

$('ul').mouseover(function (e) {
    var a = $(e.target); // e.target is the element which fired the event
    a.css('color', 'white');
});

这样可以节省资源，因为每个<li>元素只使用一个事件监听器而不是一个。

Answer 2

尝试：

var a = $(this).find("a");

Answer 3

$('li').mouseover(function () {
   var a = $("a", this);
   a.css('color', 'white');
});

第二个参数指定上下文。因此，它会在a的上下文中找到所有this，即li

Answer 4

您可以使用jQuery .find()来查找元素

Answer 5

如果您的父标记是

<li>您的子标记为<div>

然后您可以使用以下命令找到子标记：

$('li').mouseover(function () {
  var innerElement=$(this).find("div");
  innerElement.css('color', 'white');
}