当我将鼠标悬停在具有类包装器属性的 div 上时,我想显示没有属性类包装器的 div 数量的警报。这看起来很容易,但我就是看不出我做错了什么。 这是代码:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class ="wrapper"> <p> aa </p> </div>
<div class ="wrapper"> <p> dd </p> </div>
<div class ="wrapper"> <p> cc </p> </div>
<div> <p> bb </p> </div>
<div> <p> bb </p> </div>
<div> <p> bb </p> </div>
</body>
<script type ="text/javascript">
var divs = document.getElementsByClassName('wrapper');
var ps =document.getElementsByTagName('p');
for (var i=0; i<divs.length; i++){
divs[i].onhover =function(){
var intervalId = setInterval(function(){
alert(ps.length - divs.length)},5000);
setTimeout(function(){clearInterval(intervalId);},25000);
}
}
</script>
</html>
最佳答案
您可以使用document.getElementsByTagName
来获取div
的总数和
document.getElementsByClassName
使用类包装器获取 div
然后使用addEventListener
向此div
添加mouseover
事件
var getTotoalDiv = document.getElementsByTagName('div');
var divs = document.getElementsByClassName('wrapper');
var divWithoutWrapper = (getTotoalDiv.length - divs.length);
// Converting nodelist to array since `divs` is a HTMLCollection
var getNodesArray = Array.prototype.slice.call(divs);
getNodesArray.forEach(function(item) { //using array#forEach method to loop
item.addEventListener('mouseover', function() {
alert(divWithoutWrapper)
})
});
关于javascript - 将鼠标悬停在元素上时显示警报,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39314472/