【Javascript】【DOM】document.querySelectorとdocument.getElement ByClass Nameの違い

jsを通じてDOM構造を変えると、document.getElementByClass Nameは古いクエリ結果document.querySelectorを更新します.
htmlコード

测试document.getElementByClassName

    
        $(() => {
            let items = document.getElementsByClassName("clz");
            console.log(items.length); //5

            let appendNode = document.createElement("div");
            appendNode.classList.add("clz");
            document.body.appendChild(appendNode);
            console.log(items.length); //6，          
        });
    

テストdocument.querySelector

    
        $(() => {
            let items = document.querySelectorAll(".clz");
            console.log(items.length); //5

            let appendNode = document.createElement("div");
            appendNode.classList.add("clz");
            document.body.appendChild(appendNode);
            console.log(items.length); //5，        
        });
    

Dcument.getElemenntByClass Nameがもっと優れています.