JavaScript를 사용하여 innerHTML 변경

Anika Tabassum Era 2024년2월15일
JavaScript를 사용하여 innerHTML 변경

JavaScript에서 이러한 속성은 HTML 요소와 상호 작용하지만 innerHTML은 가장 선호되는 요소 중 하나입니다. innerHTML 속성은 일반적으로 특정 요소의 HTML 섹션에 설정된 기본값을 반환합니다.

이 속성은 사용자 정의 값을 설정할 수도 있습니다. 여기서 값은 문자열을 나타냅니다. 이 간단한 자습서에서는 속성이 작업을 수행하는 방법을 살펴봅니다.

innerHTML 속성을 사용하여 HTML 콘텐츠 변경

innerHTML 속성은 일반적으로 HTML 요소의 인스턴스와 함께 태그가 지정됩니다. 쿼리 선택기는 변경할 특정 영역을 정의하여 이전에 하드 코딩된 콘텐츠를 변경합니다.

여기에 특정 문자열 콘텐츠가 포함된 div 요소가 있습니다. innerHTML 속성을 사용하여 지정된 요소를 위로했다면 거기에 코딩된 내용을 정확하게 얻을 수 있습니다.

예를 들어 결과적으로 abc를 받았지만 값을 변경하고 다른 값으로 설정했습니다. 따라서 div 요소에 내용이 있더라도 여전히 새 세트 문자열에 의해 트리거되고 창에서 미리 볼 수 있습니다.

코드 조각:

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <title>Test</title>
   </head>
   <body>
      <script>
         function doChange(){
         document.getElementById('change').innerHTML = ('Dealing with JavaScript innerHTML.');
         
         }
         window.onload=doChange;
      </script>
      <div id="change">abc</div>
   </body>
</html>

출력:

innerHTML 속성을 사용하여 HTML 내용 변경

실행 코드

Anika Tabassum Era avatar Anika Tabassum Era avatar

Era is an observer who loves cracking the ambiguos barriers. An AI enthusiast to help others with the drive and develop a stronger community.

LinkedIn Facebook

관련 문장 - JavaScript HTML