til45 data attribute / dataset / getAttribute() 사용자 정의 속성 활용 네이버 바로가기 나는 레드 html 코드에 위 코드와 같이 data-* 을 사용하여 사용자정의 속성을 추가할 수 있다. 사용자 정의 속성 가져오기 (data-*) data-* 은 두 가지 방법으로 가져올 수 있다. dataset 프로퍼티와 getAttribute()이다. 1. dataset 프로퍼티 data-text-size와 같이 - (대시)가 두 번 연달아 있을 경우에는 카멜케이스를 사용하여 가져올 수 있다. const $p = document.querySelector('.text'); console.log($p.dataset.color); //red console.log($p.dataset['color']); //red console.log($p.dataset.textSize.. 2023. 12. 28. getElementsByClassName 과 querySelector textarea 의 value 에 값을 넣을 때 대상이 되는 요소를 가져오는데 getElementsByClassName 로는 안되고, querySelector 로 가져올 때 정상작동이 되어 차이점을 알아보려고 한다. getElementsByClassName 동일한 class를 갖고 있는 모든 요소 목록의 HTMLCollection 을 반환 console.log(parent.getElementsByClassName('comments-area')); 결과 HTMLCollection 이란? 요소의 문서 내 순서대로 정렬된 일반 컬렉션을 나타내며 리스트에서 선택할 때 필요한 메서드와 속성을 제공합니다(배열과 유사한 모습) 문서가 바뀔 때 실시간으로 업데이트 된다. querySelector 단 하나의 요소만 반환.. 2023. 12. 27. firebase updateDoc, getDoc 으로 데이터 조회 및 수정하기 / git branch 최신화 등록된 방명록 수정하기 방명록 각 데이터의 식별 가능한 id 가져오기 (코드의 일부) let docs = await getDocs(collection(db, 컬렉션명)); docs.forEach((doc) => { let row = doc.data(); let html = ` 닉네임 : ${row.nicname} 내용 : ${row.content} ` }); firebase 공식 문서를 통해 doc.id 를 가져왔다. 수정시에 방명록의 id를 넘겨주기 위해 input hidden 으로 만들고 value 에 doc.id 를 넣었다. 수정 기능 import { doc, updateDoc, getDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-f.. 2023. 12. 26. [TIL] 프로젝트에서 맡은 일 - 메인 틀 레이아웃 작업. - 헤더 레이아웃 및 스크롤 작업. - firebase로 작성된 방명록 글 수정 작업. 오늘은 공식문서의 중요성을 깨달았다. firebase 로 글 수정을 하기 위해서는 데이터의 id 값이 필요했는데, 문서를 보면서 찾게 되었다. doc.id 로 id를 가져올 수 있었다. id를 부여해야할지 고민했는데, 이 고민은 문서를 보고 해결하게 됐다. 글 수정 작업을 위해서 수정 버튼을 누르면 게시물의 내용이 작성 폼으로 내용을 옮겨서 수정할 수 있도록 작업중이였는데, 버튼의 조상 태그를 가져오는게 쉽지 않았다. $(document).on('click', '.updateBtn', function(e){ const target = e.target; const par.. 2023. 12. 22. 첫 팀프로젝트 시작 / git 명령어 / 리눅스 명령어 리눅스 명령어 mkdir 디렉터리명 : 폴더 새로 만들기 ls : 현재 디렉터리의 파일 목록을 표시 ls -a : 숨김 파일까지 전체 표시 cd.. : 상위 디렉터리로 이동 cd 폴더명 : 폴더명으로 이동 pwd : 현재 디렉터리 경로 출력 clear : 터미널 화면을 지운다. git 명령어 git init : 저장소 생성, 깃 초기화, 초기 셋팅 git add 파일명 : 깃에 올릴 파일 지정 git add . : 파일명 대신 점으로 변경된 파일을 전부 지정할 수 있다. git commit -m "메시지~" : 커밋 생성 git push origin 브랜치명 : 변경사항 업로드 git pull : 변경 내용 가져오기 git clone 주소~ .: 저장소 복제하기 (이때, git init은 안해도 된다.).. 2023. 12. 21. 이전 1 ··· 3 4 5 6 다음