[자바스크립트 js] HTML 속성에 접근 .getAttribute / 속성 추가 및 수정 .setAttribute / 속성 삭제 .removeAttribute

대부분의 HTML 속성은 DOM객체의 프로퍼티로 변환이 된다.

하지만, 표준속성이 아닌 경우에는 프로퍼티로 변환이 안 되는데, 아래 메소드를 활용하면 표준이 아닌 HTML 속성들도 다룰 수 있다.

 

  element.getAttribute('속성'); : 속성에 접근하기

console.log(tooktak.getAttribute('href'));
console.log(tooktak.getAttribute('class'));

 

 

 

  element.setAttribute('속성', '값'); : 속성 추가(수정)하기

원래 없는 내용이면 추가가 되고, 원래 있던 내용이면 수정이 됨.

tooktak.setAttribute('class', 'list'); // list라는 클래스를 추가
link.setAttribute('href', 'https:www.anerim.tistory.com'); //수정

 

 

 

  element.removeAttribute('속성'); : 속성 제거하기

tooktak.removeAttribute('href');
tooktak.removeAttribute('class');