js里面的class=“active”是什么意思？

JavaScript06

js里面的class=“active”是什么意思？,第1张

class说明是一个类，class=“active”本身这句是html代码，如果在css里设置样式应该在类名前加个点，如.active{}，从经验看，active这个类一般用在导航条中当前高亮的栏目，或者选项卡中当前活动着的选项

给你一个简单的原生html5实现的例子吧。没有使用jquery。

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style type="text/css">

        li {

            display: inline-block

            width: 100%

            height: 30px

            line-height: 30px

        }

        li:active, li:focus, .li-active {

            background: #dddddd

            color: red

        }

    </style>

    <script type="text/javascript">

        onload = function () {

            function removeActiveClass(node) {

                node.className = ''

            }

            document.querySelector('ul[id=test]').onclick = function (e) {

                Array.prototype.forEach.call(document.querySelectorAll('ul[id=test] > li'), removeActiveClass)

                var target = e.target

                target.className = 'li-active'

            }

        }

    </script>

</head>

<body>

<ul id="test">

    <li>1111</li>

    <li>2222</li>

    <li>3333</li>

    <li>4444</li>

</ul>

</body>

</html>