본문 바로가기

분류 전체보기142

[JS] FileReader 📌 참고 사이트 [JavaScript]파일 입출력 - FileReader 객체 (tistory.com) [JavaScript]파일 입출력 - FileReader 객체 FileReader란? FileReader는 type이 file인 input 태그 또는 API 요청과 같은 인터페이스를 통해 File 또는 Blob 객체를 편리하게 처리할 수 있는 방법을 제공하는 객체입니다. abort, load, error와 같은 이벤트에 developer-talk.tistory.com 자바스크립트 비동기 처리와 콜백 함수 • 캡틴판교 (joshua1988.github.io) 자바스크립트 비동기 처리와 콜백 함수 (중급) 중급 자바스크립트 개발자가 되기 위한 자바스크립트 비동기 처리와 콜백 함수 이해하기. 콜백 지옥과 해.. 2023. 8. 21.
[JS] innerText, innerHTML, textContent 📌 innerText, innerHTML, textContent의 차이점 [Javascript] innerHTML, innerText, textContent 차이점 (tistory.com) [Javascript] innerHTML, innerText, textContent 차이점 innerHTML, innerText, textContent 속성은 node나 element의 텍스트값을 읽어오고 설정할 수 있다는 점에서 비슷합니다. innerHTML과 innerText의 차이점은 지난 포스팅에서 살펴보았습니다. [Javascript] innerText와 in hianna.tistory.com 2023. 8. 19.
[JS] getElement~, querySelector~로 요소 검색하기 📌 참고 사이트 getElement*, querySelector*로 요소 검색하기 (javascript.info) getElement*, querySelector*로 요소 검색하기 ko.javascript.info 📋 document.getElementById 혹은 id를 사용해 요소 검색하기 HTML 요소에 id 속성이 존재한다면 위치에 상관없이 메서드 document.getElementById(id)를 이용해 접근이 가능하다. ex) 💻 HTML ... ... 💻 JS // 요소 가져오기 const element = document.getElementById('element'); // 요소의 배경색 변경하기 element.style.backgroundColor = 'red'; ❗ 주의할 점 ➡️ an.. 2023. 8. 18.
[JS] DOM 탐색하기 📌 참고 사이트 https://ko.javascript.info/dom-navigation DOM 탐색하기 ko.javascript.info 📋 DOM 접근하기 요소에 어떤 작업을 하고자 할 때에는 우선 조작하고자 하는 DOM 객체에 접근하는 것부터 선행되어야 한다. DOM에 수행하는 모든 연산은 진입점 역할을 하는 document 객체에서 시작한다. 📍 트리 상단의 documentElement와 body ➡️ document.documentElement를 통해 접근 가능하다. html은 document를 제외하고 DOM 트리의 가장 위에 위치한다. ➡️ document.body는 요소에 해당하는 DOM 노드이다. ➡️ 📍 parentNode 와 의 부모 노드, 즉 parentNode는 이 된다. 이것도.. 2023. 8. 17.