반응형 분류 전체보기127 vscode 유용한 기능 Vscode의 유용한 기능들 셀렉션 위/아래로 이동 alt + 방향키 위/아래 셀렉션 복사 alt + shift + 방향키 위/아래 멀티 커서 에디팅 (Multi Cursor Editing) ctrl + alt + 방향키 위/아래 떨어져 있는 단어들을 동시에 편집하려면 ctrl + shift + L 2019. 9. 25. CSS3 + jQuery로 버튼효과 HTML5 1 cilck CSS3 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 .more_btn { overflow: hidden; display: block; position: relative; width: 160px; margin-top: 45px; border: 1px solid skyblue; font-size: 13px; font-weight: 700; line-height: 54px; text-align: center; color: #222; -webkit-transition: color .4s; transition: color .4s; font-.. 2019. 9. 25. jQuery 효율적으로 사용하기 한 번 탐색한 DOM을 다시 탐색하게 하지 않기 bad code 1 2 3 4 5 6 7 8 9 10 11 $('button').on('click', function() { // DOM 한번 탐색 $('.modal').modal(); // DOM 다시 한번 탐색 $('.modal').addClass('active'); // DOM 또 다시 한번 탐색 $('modal').css(...); }); good code 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 $('button').on('click', function() { // DOM 한번만 탐색 (체이닝) $('.modal') .modal() .addClass('active') .css(...); }); $('button').. 2019. 9. 25. Vue.js에 대해 Vue는 요즘 핫한 자바스크립트 프레임워크로 사용되고 있다. React와 Angular가 항상 비교 대상이였지만, Vue의 등장으로 크게 3가지로 비교되고 있다. Vue의 등장은 신선했다. 왜냐하면 Vue.js는 혈통 없이 React와 Angular의 성공과 실패로부터 만들어졌다. 크게 React(Virtual DOM)와 Angular(양방향 바인딩)의 장점을 가져왔기에, 반은 먹고 들어간다. Vue.js의 장점들은 다음과 같다. 1. 학습 곡선이 낮다. Vue를 접해보았다면, 굉장히 쉽다는 것을 느꼈을 거라 생각한다. 사실 사람마다 틀릴 수 있으나, 알려진 학습 곡선은 Angular > React > Vue 순이 된다. Vue의 공식 문서도 이해하기 쉽게 설명했다고 생각한다. 한글 번역까지 많은 분들이.. 2019. 9. 25. on이벤트에 파라미터 전달 1 2 click click 1 2 3 4 5 6 7 8 9 10 11 12 13 var btn1 = $('.btn1'); var btn2 = $('.btn2'); var two = 2; var three = 3; btn1.on('click', { number : 1}, test); btn2.on('click', { number : 2}, test); function test( $e ){ alert( $e.data.number ); } on이벤트에 { name: } 이라는 파라미터를 만들고 data.number로 호출하면 버튼을 클릭했을때 각각 1,2가 출력된다. 2019. 9. 25. 삼항 조건 연산자 if 문을 사용할 때 한줄로 축약할 수 있는 방법입니다. 아래 예제입니다. 1 2 3 4 5 var age = 30; var canDrinkAlcohol = (age > 19) ? "true, over 19" : "false, under 19"; alert(canDrinkAlcohol); // true, over 19 if / else 문 대신 삼항 연산자를 사용하면 함수를 사용할 때 깔끔하게 만들 수 있습니다. if/else 1 2 3 4 5 6 7 8 9 10 11 function canDrinkAlcohol(age){ if(age > 19){ return true }else{ return false } } var output = canDrinkAlcohol(20); alert(output) //tr.. 2019. 9. 25. 이전 1 ··· 17 18 19 20 21 22 다음 반응형
