用JavaScript写一个鼠标悬停变色事件

A酒客

于 2021-09-17 23:04:55 发布

阅读量2.5k

点赞数 3

分类专栏：初学HTML 文章标签： javascript html5 html

本文链接：https://blog.csdn.net/qq_54108380/article/details/120358540

版权

初学HTML 专栏收录该内容

12 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .bg{
            color: red;
        }
    </style>
</head>
<body>

    <p>我是一段文字</p>
    <p>我是一段文字</p>
    <p>我是一段文字</p>
    <p>我是一段文字</p>

    <script>
        var ps = document.getElementsByTagName("p")
        for(var i in ps){
        ps[i].onmouseover = function(){
                this.setAttribute("class","bg")
            }
            //为每一个p标签添加鼠标离开事件
            ps[i].onmouseout = function(){
                    this.removeAttribute("class")
                }
        }

    </script>
</body>
</html>