Counting Button

이종희·2023년 7월 25일
1

  • 버튼 누르면 숫자 증가 (무한대)


HTML

<h1>Counting Button</h1>

    <p id="countBtn">0</p>
    <button id="countBtn" onclick="increase()">+</button>

JS

<script>
		// 기본값 0
        var count = 0;
        // 증가 함수
        function increase() {
        	// 1씩 증가
            count = count+1;
            // 증가한 숫자 텍스트로 끌고 옴
            document.querySelector("#countBtn").innerText=count;
        }
    </script>

querySelector

  • 반환된 HTML 요소를 상대로 DOM API에서 제공하는 다른 메서드를 사용할 수 있게 됨
// 첫번째 요소
const pEl = document.querySelector("p");

innerText

  • 요소와 그 자손의 렌더링 된 텍스트 콘텐츠를 나타냄
  • 사용자가 커서를 이용해 요소의 콘텐츠를 선택하고 클립보드에 복사했을 때 얻을 수 있는 텍스트의 근삿값을 제공
const renderedText = htmlElement.innerText
htmlElement.innerText = string

0개의 댓글