将鼠标悬停在元素上时显示提醒

时间:2016-09-04 07:16:45

标签: javascript

当我将鼠标悬停在具有类包装器atributte的div上时,我想显示一个警告,其中包含不具有atributte类包装器的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>

2 个答案:

答案 0 :(得分:3)

您可以使用<local:MyControl> <local:MyControl.MainContent> <!-- some content :-) --> <Image Source="Assets/LockScreenLogo.png" Width="100"/> </local:MyControl.MainContent> </local:MyControl> 获取document.getElementsByTagNamediv的总数 document.getElementsByClassName使用类包装器获取div

然后使用addEventListenermouseover事件添加到此div

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)
  })
});

JSFIDDLE

答案 1 :(得分:1)

Please try tis code 

<script type ="text/javascript">
var divs = document.getElementsByTagName('div');
for(i=0;i<divs.length;i++){
    if(divs[i].getAttribute('class') != 'wrapper'){
        divs[i].addEventListener('mouseover',function(){
            alert('class'); 
        })
    }
}
</script>
</html>