자바스크립트 getElementById().innerhtml

document.getElementById().innerHTML은 JavaScript에서 HTML 요소의 내용을 변경하거나 가져오는 데 사용되는 메서드입니다. 이 메서드는 문서 내의 특정 id를 가진 HTML 요소를 선택하고 해당 요소의 내용을 반환하거나 변경할 수 있습니다.

 

사용법

 

선택한 요소의 내용을 변경하려면 innerHTML 속성에 새로운 HTML 콘텐츠를 할당하면 됩니다. 예를 들어, 다음과 같은 HTML 코드가 있다고 가정해봅시다.

 

<div id="myDiv">Hello, World!</div>

 

이 경우, id가 "myDiv"인 div 요소의 내용을 변경하려면 다음과 같은 JavaScript 코드를 사용할 수 있습니다.

 

document.getElementById("myDiv").innerHTML = "안녕하세요, 세상!";

 

위 코드를 실행하면 div 요소의 내용이 "Hello, World!"에서 "안녕하세요, 세상!"으로 변경됩니다.

또한, innerHTML 메서드는 HTML 태그를 포함한 문자열을 반환할 수도 있습니다. 예를 들어, 다음과 같은 HTML 코드가 있다고 가정해봅시다.

 

<div id="myDiv">Hello, <span>World!</span></div>

 

이 경우, id가 "myDiv"인 div 요소의 내용을 반환하려면 다음과 같은 JavaScript 코드를 사용할 수 있습니다.

 

var content = document.getElementById("myDiv").innerHTML;
console.log(content); // "Hello, <span>World!</span>"

 

위 코드를 실행하면 "Hello, <span>World!</span>"이라는 문자열이 로그에 출력됩니다.