[javascript]HTML 내용, 속성, 스타일 변경하기

반응형

1. html의 내용 변경

.innerHTML = ""
예를 들어 html로 div안에 홍길동이라는 이름을 화면에 출력되있음 <div>홍길동</div>
홍길동을 이순신으로 바꿔서 출력하고 싶을때는 

document.getElementById("id명").innerHTML = "이순신"; 
document.querySelector("div(태그명)").innerHTML = "이순신";

el.innerHTML => 태그를 포함하여 수정
el.innerTEXT => 글자만 수정

See the Pen Untitled by namminimi (@namminimi) on CodePen.

 

 

 

 

2. html 속성변경

document.getElementById("id명").src = 'pic.gif';
document.querySelector("div(태그명)").src = 'pic.gif';

 

See the Pen Untitled by namminimi (@namminimi) on CodePen.

 

 

 

 

3.html의 스타일

document.getElementById("id명").style.background = "red"
document.querySelector("div(태그명)").style.background = "red"

 

See the Pen Untitled by namminimi (@namminimi) on CodePen.

 

 

 

 

clink 이벤트 링크 넣어줘야함