JavaScript의 GetElementById를 사용하여 특정 요소에 액세스하는 방법 - 더미

JavaScript를 사용하여 HTML 페이지 내의 요소에 액세스 할 수 있습니다. 요소 또는 CSS 스타일을 변경하려면이 작업을 수행 할 수 있습니다. 운동으로 시도해보십시오.

1. 새 문서 나 빈 문서로 텍스트 편집기를 엽니 다.

   

2. 텍스트 편집기에서 다음 HTML 및 JavaScript를 배치하십시오.

   2 장 두 번째 줄
   이것은 단락에 나와 있습니다.
   마지막 줄 var theDiv = 문서. getElementById ("myDiv"); 알림 ("내용은"+ theDiv. innerHTML)입니다.
   

3. 파일을 getbyid로 저장합니다. html을 문서 루트에 추가하십시오.

   

4. 웹 브라우저를 열고 http: // localhost / getbyid에서 페이지를보십시오. html.

   여기에 표시된 것과 같은 경고가 표시됩니다.

   

5. 경고를 닫고 브라우저를 닫으려면 확인을 클릭하십시오.

6. getbyid 내에서 뒤로. HTML 편집기에서 alert로 시작하는 JavaScript 행을 제거하십시오. 그 라인을 다음 두 라인으로 대체하십시오:

   theDiv. 스타일. border = "3px 검정색"; theDiv. innerHTML = "글자가 변경되었습니다.";
   

   전체 스크립트 블록은 이제 다음과 같이 보입니다:

   var theDiv = 문서. getElementById ("myDiv"); theDiv. 스타일. border = "3px 검정색"; theDiv. innerHTML = "글자가 변경되었습니다.";
   

   브라우저에서 볼 때 페이지는 이제 여기에 표시된 것과 같습니다. 특히 맨 위 줄의 텍스트가 변경되었고 이제는 테두리가 있음을 주목하십시오.