이 코드에서 마우스를 가져 가면서 div의 색상을 변경합니다. 스타일을 사용하지 않고 대신 네임 스페이스가있는 스크립트에 넣으려면 어떻게해야합니까?
<html>
<head>
<title></title>
<style type="text/css">
.link-container {
border: 1px solid;
width: 50%;
height: 20px;
}
.link-container a {
display: block;
background: green;
height: 100%;
text-align: center;
}
.link-container a:hover {
background: red;
}
</style>
</head>
<body>
<div class="link-container">
<a>hover to change color</a>
</div>
</body>
</html>
mouseover요소의 이벤트를 사용할 수 있습니다 .
[].forEach.call(document.getElementsByClassName('link-container'),function(e){
e.addEventListener("mouseover", function(){
this.style.background='red'
});
});
편집 : mouseout적용된 스타일을 제거 하려면 이벤트가 필요합니다 .
[].forEach.call(document.getElementsByClassName('link-container'),function(e){
e.addEventListener("mouseover", function(){
this.style.background='red'
});
e.addEventListener("mouseout", function(){
this.style.background='inherit'
});
})
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다