Javascript jquery检查img是否在div内

//w a s d
$（文档）.ready（函数（e）{
var键={}；
$（文档）.keydown（函数（事件）{
keys[event.which]=true；
}).keyup（功能（事件）{
删除键[event.which]；
});
var$d=$（“img”）；
函数gameLoop（）{
如果（键[68]）{
$d.css（“左”，函数（i，oldVal）{返回parseInt（oldVal）+5+“px”；}）；
}
如果（键[65]）{
$d.css（“左”，函数（i，oldVal）{返回parseInt（oldVal）-5+“px”；}）；
}
如果（键[83]）{
$d.css（“top”，函数（i，oldVal）{返回parseInt（oldVal）+5+“px”；}）；
}
否则，如果（键[87]）{
$d.css（“top”，函数（i，oldVal）{返回parseInt（oldVal）-5+“px”；}）；
}
setTimeout（gameLoop，20）；
}
gameLoop（）；
$（document.focus（）；
});
//箭
$（文档）.ready（函数（e）{
var键={}；
$（文档）.keydown（函数（事件）{
keys[event.which]=true；
}).keyup（功能（事件）{
删除键[event.which]；
});
var$d=$（“img”）；
函数gameLoop（）{
如果（键[37]）{
$d.css（“左”，函数（i，oldVal）{返回parseInt（oldVal）-5+“px”；}）；
}
else if（键[39]）{
$d.css（“左”，函数（i，oldVal）{返回parseInt（oldVal）+5+“px”；}）；
}
如果（键[40]）{
$d.css（“top”，函数（i，oldVal）{返回parseInt（oldVal）+5+“px”；}）；
}
否则如果（键[38]）{
$d.css（“top”，函数（i，oldVal）{返回parseInt（oldVal）-5+“px”；}）；
}
setTimeout（gameLoop，20）；
}
gameLoop（）；
$（document.focus（）；
});
$（文档）.ready（函数（）{
如果（$（“.goal:has（img）”）{
警惕（“是”）；
}
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
尝试使用
$（.goal”）。查找（“img”）。长度>0


$（文档）.ready（函数（）{
如果（$（“.goal”）.find（“img”）.length>0）{
警惕（“是”）；
}else{alert（“no”）；}
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
尝试使用
$（.goal”）。查找（“img”）。长度>0


$（文档）.ready（函数（）{
如果（$（“.goal”）.find（“img”）.length>0）{
警惕（“是”）；
}else{alert（“no”）；}
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
更改选择器并检查结果的长度：
$（“.goal img”）.length


$（文档）.ready（函数（）{
如果（$（“.goal img”）.length）{
警惕（“是”）；
}
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
更改选择器并检查结果的长度：
$（“.goal img”）.length


$（文档）.ready（函数（）{
如果（$（“.goal img”）.length）{
警惕（“是”）；
}
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
试试这个

$(document).ready(function(){
    if($("img").closest('.goal').length){
        alert("yes");
    }
});

试试这个

$(document).ready(function(){
    if($("img").closest('.goal').length){
        alert("yes");
    }
});

使用
find
检查图像标签
length


$（文档）.ready（函数（）{
if（$（'.goal'）.find（'img'）.length>0）
警惕（“是”）；
其他的
警告（“否”）；
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
使用
find
检查图像标签
length


$（文档）.ready（函数（）{
if（$（'.goal'）.find（'img'）.length>0）
警惕（“是”）；
其他的
警告（“否”）；
});
img{
位置：绝对位置；
左：0；
排名：0；
}
.目标{
宽度：10px；
高度：10px；
背景颜色：绿色；
浮动：对；
}

超级马里奥！
您的问题有两种情况

任何级别的div内部的图像，子级和它的子级。那么,

if ($(".goal").find('img').length) {
        // yes
    }

如果您想只检查孩子，而不检查孩子的孩子，您可以尝试

if($(.goal).find('> img').length) {
   // yes
}

你的问题有两个案例

任何级别的div内部的图像，子级和它的子级。那么,

if ($(".goal").find('img').length) {
        // yes
    }

如果您想只检查孩子，而不检查孩子的孩子，您可以尝试

if($(.goal).find('> img').length) {
   // yes
}

我想要一个警报框，当马里奥（img）在
目标（div）

似乎不需要检查元素
img
是否在
div
内。你要做的只是检查你的马里奥
img
的坐标是否在目标
div
的范围内

最简单的方法是使用，获得保存元素大小和位置的
DOMRect
对象。用这个来判断你的马里奥是否在你的目标范围内

创建一个函数，在每次进行键盘导航时检查位置。像这样：

function checkMario() { 
  var goalPost = $('.goal')[0].getBoundingClientRect();
  var mario = $('#mario')[0].getBoundingClientRect();
    if ((goalPost.left - mario.left) < 60) {
      $('#result').text('yesssss');
    } else {
      $('#result').text('no yet');
    }
}

img{
位置：绝对位置；
左：0；顶部：0；宽度：60px；
}
.目标{
宽度：10px；高度：10px；
背景色：绿色；浮动：右侧；
}
p{margin top:64px；}




我想要一个警报框，当马里奥（img）在
目标（div）

似乎不需要检查元素
img
是否在
div
内。你说什么