js动态设置HTML标签class

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>追番</title>
    <style>
        .active{
            border-bottom: solid 1px yellowgreen;
        }
    </style>
    <!-- <script src="localforge.min.js"></script> -->
</head>
<body>
    <button onclick="changeList('在看',this)">在看</button>
    <button onclick="changeList('想看',this)">想看</button>
    <button onclick="changeList('搁置',this)">搁置</button>
    <button onclick="changeList('看过',this)">看过</button>
    <button onclick="changeList('抛弃',this)">抛弃</button>
    <script>
        function changeList(watch_type,self)
        {
            self.className = "active"
            switch (watch_type) {
                case "在看":
                    
                    break;
                case "想看":
                    
                    break;
                case "搁置":
                    
                    break;
                case "看过":
                    
                    break;
                case "抛弃":
                    
                    break;
                default:
                    break;
            }
        }
    </script>
</body>
</html>
posted on 2026-01-20 10:45 小沙盒工作室阅读(0) 评论(0) 收藏举报