======Javascript HTML DOM, Changing CSS====== * description : Javascript HTML DOM, Changing CSS * author : 오션 * email : shlim@repia.com * lastupdate : 2021-04-20 \\ =====Source of the article==== * [[https://www.w3schools.com/js/js_htmldom_css.asp|Javascript HTML DOM, Changing CSS]] \\ %%HTML DOM%%을 사용하면 %%JavaScript%%가 %%HTML%% 요소의 스타일을 변경할 수 있습니다.\\ =====Changing HTML Style===== %%HTML%% 요소의 스타일을 변경하려면 다음 구문을 사용하십시오:


document.getElementById(id).style.property = new style

\\ 다음 예제는 ''%%

%%'' 요소의 스타일을 변경합니다.\\ ====예제====

Hello World!


  Bonjour les enfants!!

  

  The paragraph above was changed by a script.

=====Using Events===== %%HTML DOM%%을 사용하면 이벤트가 발생할 때 코드를 실행할 수 있습니다.\\ \\ %%HTML%% 요소에 아래와 같은 "동작이 발생"하면 브라우저에서 이벤트를 생성합니다.\\ * 요소가 클릭 됨 * 페이지가 로딩 * 입력 필드(input fields)가 변경됨 다음 예제는 사용자가 버튼을 클릭할 때, ''%%id="id1"%%''를 가진 %%HTML%% 요소의 스타일을 변경합니다.\\ ====예제====






  My Heading 1

=====Visibility===== 요소를 보이고 보이지 않게 하는 방법






  
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed quo accusamus doloremque alias 
    sapiente enim praesentium magni autem, iusto quia.

=====HTML DOM Style Object Reference===== 모든 %%HTML DOM%% 스타일 속성에 대해서는 [[https://www.w3schools.com/jsref/dom_obj_style.asp|HTML DOM Style Object Reference]]를 참조하십시오. {{tag>오션, Javascript HTML DOM, Changing CSS}}