본문 바로가기

전체 글

 (41)
[Vue3 + TS] Event Target 에러 1. (event)에 타입 Event 설정해주기 2. event.target.textContent 하면 Property 'textContent' does not exist on type 'EventTarget' 에러 뜸 (event.target as HTMLLIElement).textContent 로 작성해주기 const dpText = ref('Dropdown Text'); const menuClik = (event: Event) => { const eText = (event.target as HTMLLIElement).textContent; dpText.value = eText; }; {{ item.menu }}
[JS] 두 배열 비교하여 중복되는 값 찾기 [1,2,3,4,5] 와 [2,4,5,7,8] 비교하여 중복값 찾아내기 예상 답 : 2,4,5 공감❤과 구독하기✔를 눌러주시면 블로거는 힘이나요😊
:after 과 ::after 의 차이점은 바로 이것입니다. :after은 CSS2에서 , ::after은 CSS3에서 사용하는 것입니다. 즉, 가상요소(Pseudo-elements)는 CSS2에서는 : 가 하나만 표기되고 CSS3에서는 :가 두개 표기됩니다. CSS3에서 ::after로 표기되는 이유는 가상클래스와 가상요소의 차이를 분명하게 하기 위함이라고 합니다. (둘 다 앞에 : 가 붙어서 헷갈릴까봐 차이를 주기위함인 것같음) 가상클래스 :hover, :active, :checked, :last-child ...등등 가상요소 ::after, ::before, ::first-letter, ::placeholder ...등등 하지만 호환성을 위해 :after, :before 도 허용됩니다. 결론. 가상클래스와 가상요소가 헷갈리지 않는 다면 그냥 :after, :..
[개발메모_01] 1. ftp에 첫 업로드 후, 그 다음부터의 css와 js의 업데이트가 사이트에 적용되지 않는경우에는 경로.css?ver=0.1 또는 경로.js?ver=0.1 와 같은 형식으로 버전 업데이트를 해줘야함 2. 카카오 지도 적용은 서버와 함께 적용해야 하므로 로컬에서 작업시, 적용이 안됨. (서버가 구축된 조건하에) ftp에 등록하여 해당 웹 경로에서 봐야 카카오 지도가 적용된 것을 볼 수 있음. 3. css 파일을 해상도별로 저장하여 따로 적용하는 방법. 예) pc.css / mobile.css 등등 지정해주기
[모던자바스크립트 - JS 예제 마스터] 오늘 날짜 구하기 오늘 예제는 당일 날짜를 보여주는 것이므로 에디터 결과물을 가져왔습니다. javascript 코드 var now = new Date(); var month = now.getMonth()+1; var day = now.getDate(); document.write("오늘은"+month +"월" + day +"일 입니다. "); 사실 날짜구하는건 제가 이미 할줄 아는 부분이고 쉬워서.. 하나만 설명하고 마칠게요! 왜 getMonth()에 1을 더해야하나요? getMonth()의 반환값이 0~11 이기 때문입니다. (그냥 그렇대요...w3school이 그랬어요..) 즉 1월은 0, 2월은 1 이렇게 나옵니다. 그래서 +1을 해줘야하는 거랍니당 :) 공감❤과 구독하기✔를 눌러주시면 블로거는 힘이나요😊
[모던자바스크립트 - JS 예제 마스터] 체질량 구하기 HTML 코드 키 : cm 몸무게 : kg 당신의 체질량지수는 ?입니다. Javascript 코드 window.onload = function(){ document.getElementById("button").onclick = function(){ var h = parseFloat(document.getElementById("height").value); var w = parseFloat(document.getElementById("weight").value); var bmi = document.getElementById("bmi"); bmi.innerHTML = (w/((h*h)/10000)).toFixed(1); } } 이번 예제는 크게 어려운 부분은 없었던 것 같아요. 하지만 또 새로운 메서드가 등..
[모던자바스크립트 - JS 예제 마스터] 스탑워치 만들기 모던자바스크립트 - 스탑워치 만들기 HTML 코드 0.00 태그에 초시계를 넣어주고 각 start, stop 버튼을 input으로 만들어 줍니다. Javascript 코드 window.onload = function(){ var startButton = document.getElementById("start"); var stopButton = document.getElementById("stop"); var display = document.getElementById("display"); var startTime, timer; startButton.onclick = start; function start(){ startButton.onclick = null; stopButton.onclick = stop..
웹접근성이 무엇이지 파헤쳐보다 웹 접근성을 쉽게 이해하기 위해서는 접근성이라는 단어부터 한번 보는게 좋을 것 같습니다. 1. 일상생활 속의 접근성 우리가 어떤 장소를 갈 때에 그 곳은 접근성이 좋다. 라고 하죠. 즉, 도달하기 쉽다 라는 뜻과 같습니다. 아마 접근성이 좋은 장소는 교통이 편리하다고도 볼 수도 있을 것 같습니다. 2. 사전적 의미의 접근성 사전적 의미로 접근성이 높다는 것은 어떠한 것을 이용하는 데 있어서 편리하다는 뜻도 있습니다. 3. 웹 접근성 그렇다면, 웹접근성은 무엇이며, 왜 필요한 것일까요? 웹을 통한 정보 전달이 점점 활발해지면서 웹을 사용하는 사람들도 점점 많아지고 있습니다. 또한 그러한 웹들을 전달해줄 전자기기, 운영체제, 웹브라우저들도 다양해지고 있죠. 그런데 만일 웹을 사용하지 못하는 경우가 생긴다면 ..

티스토리툴바