javascript 获取元素修改元素的问题 提取不了classList属性是怎么回事

问题遇到的现象和发生背景
问题相关代码，请勿粘贴截图
运行结果及报错内容
我的解答思路和尝试过的方法
我想要达到的结果
<!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>Document</title>

    <style>
        .main .listOne li {
            background-color: bisque;
        }

        .main .spanList span {
            background-color: rgb(150, 232, 62);
        }

        .main .divList div {
            background-color: rgb(38, 58, 209);
        }
    </style>
</head>

<body>
    <div class="main">
        <ol class="listOne">
            <li>oneli</li>
            <li>oneli</li>
            <li>oneli</li>
            <li>oneli</li>
            <li>oneli</li>
        </ol>
        <div class="spanList">
            <span>spanOne</span><br>
            <span>spanOne</span><br>
            <span>spanOne</span><br>
            <span>spanOne</span><br>
            <span>spanOne</span><br>
        </div>
        <div class="divList">
            <div>divOne</div>
            <div>divOne</div>
            <div>divOne</div>
            <div>divOne</div>
            <div>divOne</div>
        </div>
    </div>

    <script>
        var liListOne = document.getElementsByClassName(".listOne");
        var allEl = document.querySelectorAll('.main');
        console.log(allEl);
        var arrLi = liListOne[0];
        console.log(liListOne);
        var a = allEl.classList;
        console.log(a);
    </script>
</body>

</html>

因为document.querySelectorAll返回的是一个数组，所以要加个索引。

var a = allEl[0].classList;

1.getElementsByClassName 选择器不用加.
2.liListOne是个集合，肯定打印不出来.classList
script改成下面的就好了


<script>
        var liListOne = document.getElementsByClassName("listOne");
        var allEl = document.querySelectorAll('.main');
        console.log(allEl);
        var arrLi = liListOne[0];
        console.log(liListOne);
        var a = arrLi.classList;
        console.log('arrLi.classList:', a);
    </script>