[JavaScript] addEventListner VS QuerySelector 무엇을 쓸까?

이건 구식 코드

        window.addEventListener('DOMContentLoaded', function () {
            var title = document.getElementById('main-title');
        console.log(title);
        });

 

요즘은 다 QuerySelector 을 쓴다.

QuerySelector 의 경우는 가져올 때 그냥 CSS 선택자를 사용하면 된다.

    <script>
        var mainTitle = document.querySelector('#main-title');
        console.log(mainTitle);
    </script>

쿼리셀렉터는 많은 class 중 첫번째에 있는 아이만 선택해온다.

다 불러오고 싶으면 QuerySelectorAll 을 사용하면 된다.

그다음 콘솔창에서 index 주거나 하면 됨.

 

    <script>
        var link = document.querySelector('.ilbuni a');
        link.classList.add('speical');
        setTimeout(function () {
            link.classList.remove('link-google');}, 2000
        );
    </script>

요건 setTimeout Method 다.

setTimeout(function() {}, 초);

(1000=>1초)