JavaScript로 요소 텍스트 작업하기
DOM 요소에는 해당 요소의 텍스트를 읽을 수 있는
textContent 속성이 있습니다.
예제를 통해 살펴보겠습니다.
다음과 같은 태그가 있다고 가정해 보겠습니다:
html<p id="elem">text</p>
이 태그에 대한 참조를 변수에 저장합니다:
javascriptlet elem = document.querySelector('#elem');
태그의 텍스트를 읽어봅시다:
javascriptconsole.log(elem.textContent);
태그의 텍스트를 변경해 봅시다:
javascriptelem.textContent = '!!!';
Задание 1
문단과 버튼이 주어졌습니다. 버튼을 클릭할 때 문단의 텍스트를 읽고 콘솔에 출력하세요.
Задание 2
문단과 버튼이 주어졌습니다. 버튼을 클릭할 때 문단에 새로운 텍스트를 작성하세요.
Задание 3
자신의 텍스트로 어떤 숫자를 포함하는 두 개의 문단과 버튼이 주어졌습니다. 버튼을 누르면 저장된 숫자들의 합을 화면에 출력하세요.
Задание 4
숫자가 있는 세 개의 문단, div 및 버튼이 주어졌습니다. 버튼을 누르면 div의 텍스트에 숫자들의 합을 작성하세요.
Задание 5
숫자가 있는 문단과 버튼이 주어졌습니다. 버튼을 눌렀을 때 문단의 값에 1을 더하고 얻은 숫자를 다시 작성하세요.
Задание 6
텍스트가 있는 문단과 버튼이 주어졌습니다. 버튼을 눌렀을 때 문단 텍스트의 끝에 느낌표를 추가하세요.