JavaScript로 요소의 HTML 코드 작업하기
DOM 요소에는 해당 요소의 HTML 코드를 읽을 수 있게 해주는 속성인 innerHTML이 있습니다.
예를 통해 살펴보겠습니다. 다음과 같은 태그가 있다고 가정해 봅시다:
<p id="elem"><b>text</b></p>
이 태그에 대한 참조를 변수에 저장합니다:
let elem = document.querySelector('#elem');
태그의 HTML 코드를 읽어봅시다:
console.log(elem.innerHTML); // 출력: <b>text</b>
태그의 텍스트를 변경해 봅시다:
elem.innerHTML = '<i>!!!</i>';
단락과 버튼이 주어집니다. 버튼을 클릭할 때 단락의 HTML 코드를 읽고 콘솔에 출력하세요.
단락과 버튼이 주어집니다. 버튼을 클릭할 때 단락에 굵은 텍스트로 새로운 텍스트를 작성하세요.