Javascript:요소 내용 변경 편집하기

{{Javascript}}

==개요==
선택한 요소의 내용을 변경하는 방법.<br />

==방법==

===클래스 관련===
{| class="wikitable"
!의도
!설명
!방법
|-
|클래스명 변경
|클래스 이름을 지정한다.
|<syntaxhighlight lang="javascript">
객체.className = '이름';
</syntaxhighlight>
|-
|클래스 추가
|기존에 추가
|<syntaxhighlight lang="javascript">
객체.className += ' 이름';  // 스페이스도 추가해 주어야 한다.
객체.classList.add('이름');  // 스페이스 필요없음.
</syntaxhighlight>
|-
|클래스 내용 변경
|기존 내용을 변경한다.
클래스 요소 중 해당 내용만 변경한다.
|<syntaxhighlight lang="javascript">
객체.classList.replace('변경전이름', '변경할이름');

객체.classList.remove('삭제할이름', ...);
</syntaxhighlight>
|-
|클래스 객체
|해당 객체 자체에서 클래스를 지운다.
|<syntaxhighlight lang="javascript">
객체.classList.remove();
</syntaxhighlight>
|}

===태그 내부 관련===
{| class="wikitable"
!의도
!설명
!방법
|-
|태그 내부의 내용 변경
|
|<syntaxhighlight lang="javascript">
객체.innerHTML = '변경할 내용';
</syntaxhighlight>
|}

= HTML 태그 속성 변경 =
이상하게 객체를 $('선택자') 형태로 지정하면 작동하지 않는다.

<code>document.getElementById('찾을객체').setAttribute('바꿀 속성', '바꿀값');</code> 이런 식으로 선택해주어야 제대로 작동한다.