The above is a very simple test code
If onmouseover bubbles, the onclick event and onmouseout event should be triggered. However, it does not happen.
Clicking the onclik event does not trigger the onmouseout event either.
So what are the specific ones that are not supported? Bubbling events?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
span{
width: 100px;
height: 100px;
background: red;
text-align: center;
line-height: 100px;
float: left;
}
p{
width: 100px;
height: 100px;
background: blueviolet;
text-align: center;
line-height: 100px;
float: left;
display: none;
}
.dis{
display: block;
}
</style>
</head>
<body>
<p id="d">
<span>
点击
</span>
<p>浮动</p>
</p>
</body>
<script>
var d=document.getElementById('d')
var s=document.getElementsByTagName('span')[0];
var p=document.getElementsByTagName('p')[0];
d.onclick=function(){
console.log('123456789')
}
s.onmouseover=function(){
p.style.display='block';
}
p.onmouseover=function(){
p.style.display='block';
}
document.onmouseout=function(){
p.style.display='none';
}
</script>
</html>
PHP中文网2017-05-19 10:20:25
There may be something wrong with your understanding of the bubbling mechanism. Bubbling is the propagation of events between different levels. . .
伊谢尔伦2017-05-19 10:20:25
For example, load, unload, blur, focus, mouseleave...
For details, please see the W3C document: Events whose Bubbles attribute is NO in the document do not support bubbling
漂亮男人2017-05-19 10:20:25
Bubbling must also be the same type of event. For example, click can only trigger click.
The event triggering mechanism is different and it will definitely not spread
