728x90
반응형
01. 요소 객체의 프로퍼티로 요소의 속성을 읽고 쓰기
요소 객체에는 일반적인 HTML 속성(id, class, name, src, href...) 과 이벤트 처리기 프로퍼티 (onclick, onmousedown...) 등이 정의 되어 있습니다.
요소 객체.속성이름
<html>
<a id ="tstoryBlog" href ="https://bokartstudio.tistory.com"> 요주의 개발자 </a>
</html>
<script>
var anchor = document.getElementById("tstoryBlog")
anchor.href ="https://bokartstudio.tistory.com"
</script>
HTML, 요소의 속성 이름은 대소문자를 구분하지 않지만 자바스크립트 요소 객체의 속성 프로퍼티는 대소문자를 구분합니다. HTML 요소의 속성을 요소 객체의 속성 프로퍼티로 사용할 때는 소문자로 작성합니다. 단, 속성 이름이 여러 단어로 구성되었다면 두 번째 이후 단어의 첫 글자를 대문자로 표기한 프로퍼티 이름을 사용합니다.
accpet-charset -> acceptCharset
accesskey -> accessKey
maxlength -> maxLength
tabindex -> tabIndex
🔨속성 값 가져오기
요소 객체.getAttribute(속성의 이름)
🔨속성 값 설정하기
요소 객체.setAttribute(속성 이름, 속성 값)
🔨속성이 있는지 확인하기
요소 객체.hasAttribute(속성 이름)
🔨속성 삭제하기
요소 객체.removeAttribute(속성 이름)
🔨전체 속성의 목록 가져오기
요소 객체.attributes
반응형
참고문헌
📌 모던 자바스크립트 입문 책
728x90
반응형
'FRONTEND > JS' 카테고리의 다른 글
| [JS] innerHTML vs innerTEXT vs textContent 차이 (0) | 2022.03.13 |
|---|---|
| [개발의 본질] 행맨 게임 JS로 만들기 | 토이 프로젝트 01 (0) | 2022.03.13 |
| [개발의 본질] 플로우 차트 (Flow chart란?) (0) | 2022.03.05 |
| [JS] 노드 객체 가져오기 (0) | 2022.03.04 |
| [JS] DOM 트리 (0) | 2022.03.03 |
