분류 전체보기216 jQuery migrate 에러 : jQuery.fn.on() is deprecated jQuery.fn.on() is deprecated jQuery 버전 업그레이드 하는 도중 위와 같은 에러 발생 하지만 jquery 공식 문서에 .on() 을 검색해도 deprecated 되었단 말은 없다. migrate js 코드를 보니 bind 관련 에러로 확인. .bind() 를 .on()으로 수정하여 해결. 그럼 jQuery.fn.bind() is deprecated 라고 나와야 하는거 아닌가? 2021. 4. 27. html element의 data에 접근하기 엘리멘트에 data- 속성을 추가하고 javascript를 이용하여 속성 값을 가져올 때 dataset을 사용한다. ... var article = document.getElementById('electriccars'); article.dataset.columns // "3" article.dataset.indexNumber // "12314" article.dataset.parent // "cars" developer.mozilla.org/ko/docs/Learn/HTML/Howto/Use_data_attributes 데이터 속성 사용하기 - Web 개발 학습하기 | MDN 데이터 속성 사용하기 HTML5 특정 요소와 연관되어 있지만 확정된 의미는 갖지 않는 데이터에 대한 확장 가능성을 염두에 두고 디.. 2021. 4. 21. '연결이 비공개로 설정되어 있지 않습니다' NET::ERR_CERT_INVALID https 프로토콜로 접속 시 '연결이 비공개로 설정되어 있지 않습니다' NET::ERR_CERT_INVALID 에러가 뜬다. 보통은 여기서 아래에 있는 [고급]을 누르면 페이지로 접근할 수 있는 링크가 나오는데, 이 경우는 접근 링크가 나타나지 않는다. 해결 방법: 페이지 내에 영문으로 thisisunsafe 라고 입력하면 정상 이동한다. velog.io/@jereint20/bypass-sslerrorpage NET::ERR_CERT_INVALID 우회 접속하기 '연결이 비공개로 설정되어 있지 않습니다.' 오류 해결법, 브라우저 내 아무곳이나 클릭 → 키보드 thisisunsafe 입력, 사내 wiki 에 "로컬 개발중 https 접속이 불가능한 경우" 라고 올린 글을 꺼내서 velog.io 2021. 4. 20. jeckyll Hydejack 테마 관리 - 카테고리 추가하기 /_featured_categories/에 카테고리명.md 파일 추가 - 카테고리에 post 쓰기 최상위 폴더에 카테고리명 폴더 생성 후 YEAR/MM/DD-파일명.md 추가 - build jekyll build - server jekyll serve 2020. 12. 17. [웹 접근성] WAI-ARIA role / aria-label html 태그 외에도 접근성적으로 의미를 부여해야 할 경우 role을 사용한다. 예) span 태그이지만 link 역할을 하는 경우 W3C website 스크린리더 시 role이 읽힌다. a 태그 같은 경우 링크, 텍스트 순으로 읽히고 button은 텍스트, 버튼(윈도우는 단추-,)로 읽힌다. 태그 내의 텍스트가 아니라 다른 멘트가 읽혀야 하는 경우 aria-label을 사용한다. 다운로드 www.w3.org/TR/wai-aria-practices-1.1/examples/link/link.html Link Examples | WAI-ARIA Authoring Practices 1.1 Link Examples The examples below demonstrate three variations of the.. 2020. 12. 15. 콜백 ref 사용하기 function MeasureExample() { const [height, setHeight] = useState(0); const measuredRef = useCallback(node => { if (node !== null) { setHeight(node.getBoundingClientRect().height); } }, []); return ( Hello, world The above header is {Math.round(height)}px tall ); } reactjs.org/docs/hooks-faq.html#how-can-i-measure-a-dom-node Hooks FAQ – React A JavaScript library for building user interfaces reac.. 2020. 12. 14. map 한번만 렌더링하기 : useMemo const map = useMemo(() => { array.map((el, i) => { return ( ); }); }, [array]); return ( {map} ) 2020. 12. 8. 컴포넌트 width 구하기 const slideWidth = slideRef && slideRef.current && slideRef.current.offsetWidth; 2020. 12. 7. 단어 사이에서 줄바꿈하고 단어길이가 길 경우 줄바꿈 word-break: keep-all 로 단어 사이에서 줄바꿈 하지만 일본어와 같이 단어 사이에 띄어쓰기가 없는 경우 줄이 바뀌지 않고 영역을 넘어 쭉 이어진다.. word-wrap: break-word를 추가해도 변함 없음.... 설마 했는데 width값을 설정하니 해결되었다. width: 100%; word-break: keep-all; word-wrap: break-word; wit.nts-corp.com/2017/07/25/4675 word-break 속성과 word-wrap 속성 알아보기 실무를 하다 보면 가볍게 이해한 스펙을 바탕으로 관습적으로 사용하는 속성들이 있다. 그중 word-break 속성과 word-wrap 속성에 대해 조금 더 명확하게 정리해보았다. 본 내용은 W3C 스펙문서에서 .. 2020. 12. 3. 이전 1 2 3 4 ··· 24 다음
