프론트앤드 이야기33

• [Javascript] javascript 클릭 target id 호출 var value = event.target.id; 프론트앤드 이야기/JavaScript & JQuery 2018. 10. 29.

• [Jquery] Jquery 2 이후 버전 체크박스 선택 checkbox 늘 검색하는 문법 ;; $('input:checkbox[id="ID"]').prop("checked",true) $('#checkAll').click(function(){ if($(this).is(":checked")){ $('input:checkbox[id="ID"]').prop("checked",true); } else { $('input:checkbox[id="ID"]').prop("checked",false); } }); 프론트앤드 이야기/JavaScript & JQuery 2018. 10. 29.

• [Javascript] 생활코딩 JS 공부 2일차 실행방법과 실습환경 프론트앤드 이야기/JavaScript & JQuery 2018. 10. 11.

• [20181010] 생활코딩 JS 공부 1일차 언어 소개 : 웹브라우저를 동적으로 제어하기위해 고안된 언어 사용자는 웹브라우저를 이용하여 자원을 요청하고 서버는 사용자의 요청에 대해 응답을 준다. 언어와 환경의 차이 언어 : JavaScript환경 : 웹 브라우저 / alert Node.js / write SpreadSheet / msgBox 프론트앤드 이야기/JavaScript & JQuery 2018. 10. 10.

• 

  [CSS] CSS 선택자 이해 화면 개발하면서 늘 헷갈리는 CSS .class ul : class 라는 class 의 모든 ul 하위 선택자에 적용.class > ul : class 라는 class 의 바로 아래 자식 ul 선택자만 적용 1. CSS 명시도(Specificity) 계산법!important > id [ 100 ] > class [ 10 ] > tag [ 1 ] > * [ 0 ] !important선언을 사용한 형식이 가장 우선 순위가 높습니다. 그래서 다른 선언들을 덮어버릴 수 있기 때문에 꼭 필요한 곳에만 사용해야 합니다.이를 제외한 나머지 선택자는 대괄호 "[]"안에 있는 숫자를 각각의 점수로 부여하여 우선순위를 계산합니다.ID 선택자의 갯수를 세어서 개당 100 으로 계산합니다. (= a)클래스 선택자의 갯수를 세.. 프론트앤드 이야기/CSS 2018. 9. 26.

• [html5] HTML5 테그 * header : 테그 안에는 적어도 한개의 제목()이 들어 있어야 하며, section, header, footer 요소는 절대 들어갈 수 없다.nav 요소도 일종의 section 이므로 header 안에 들어갈 수 없습니다. * section : 요소안에는 header, footer를 넣을 수 있으며, body에 들어갈 수 있는 모든 요소를 넣을 수 있다. 프론트앤드 이야기/HTML 2018. 9. 26.

• 

  [CSS] CSS 적용 순서 ID > class > 선택자 순이 기본요소에 inline 으로 명시된 스타일이 가장 우선순위가 높으며예외적으로 important 속성으로 정의된 것이 모든것을 무효화하며 적용순위가 제일 높다. 출처 : http://webberstudy.com/html-css/css-2/multiple-style-sheet-and-priority-order/ 프론트앤드 이야기/CSS 2018. 9. 24.

• [HTML] 추석!! 블록 요소 vs 인라인 요 바로 전 태그 설명은 이정도 리마인드 하기로하였고, 이번 포스팅에서는 inline 태그와 block 태그 이해와, 특징들을 다시한번 리마인드 하도록 하겠습니다. 블록 요소와 인라인 요소의 특징으로는 줄빠꿈 처리가 되느냐, 안되느냐의 차이가 있으며, 더 디테일한 특징은 아래 포스팅에서 확인 ~ 1. 블록 요소블록 요소는 또 다른 블록 요소와, 인라인 요소를 포함할 수 있으며, 기본속성으로 가로폭이 화면의 전체를 차지합니다. 또한 블록요소가 종료된 시점에서는 줄바꿈 처리가 되는것이 특징 ~ 블록요소 종류* div, dl, dd, dt, form, h1 ~ h6, ol, ul, pre, table* html5 태그 * section, header, footer 등* 블록 요소엔 명시적으로 width, heig.. 프론트앤드 이야기/HTML 2018. 9. 24.

• [HTML] 추석!! HTML 태그 정리 오늘은 추석 당일이다. 몇년 전부터 제사를 안하기로해서 나는 특별한 일 없으면 집에서 쉰다. 그래서 오늘은 그동안 잊고 있었던 책을 다시 처음부터 쓱 보면서 리마인드 하기로 결정 ~ (다른 공부가 더 시급.. ㅠ_ㅠ) 1. html 문서의 기본 요소 //컨텐츠 영역컨텐츠 입니다. 2. html 태그 설명(heading)* 1 ~ 6 까지 총 6단계의 속성이 있으며, 단락의 제목을 정의하는데 주로 쓰인다. (paragraph)* 문서의 단락을 나눌 때 사용하며, 위의 h 테그와 같이 이용하기 좋다. (division)* 문서의 단락을 나눌 때 p 테그를 이용했다면 div 테그는 그 모든것을 담고있는, 영역을 나눌 때 주로한다.* 물론 div 영역 안에서도 여러 영역으로 나누어 사용할 수 있다.* 제목입니다.. 프론트앤드 이야기/HTML 2018. 9. 24.

• [20180913] JQuery 를 사용하지않은 슬라이더 http://meandmax.github.io/lory/ 프론트앤드 이야기/JavaScript & JQuery 2018. 9. 13.

• [Javascript] 만나이 계산 함수 function calcAge(birth) { var date = new Date(); var year = date.getFullYear(); var month = (date.getMonth() + 1); var day = date.getDate(); if (month < 10) month = '0' + month; if (day < 10) day = '0' + day; var monthDay = month + day; birth = birth.replace('-', '').replace('-', ''); var birthdayy = birth.substr(0, 4); var birthdaymd = birth.substr(4, 4); var age = monthDay < birthdaymd ? year .. 프론트앤드 이야기/JavaScript & JQuery 2018. 8. 28.

• [20180630] 정리 $('#checkAll').click(function(){ if($(this).is(":checked")){ $("input:checkbox[name='chk[]']").prop("checked",true); } else { $("input:checkbox[name='chk[]']").prop("checked",false); } }); function chk_func(mode){ if(mode == 'del'){ var msg = "선택된 항목을 삭제하시겠습니까?"; } else if(mode == 'level_all'){ var msg = "선택된 회원의 레벨을 일괄 변경하시겠습니까?"; } var count = $("input:checkbox[name='chk[]']:checked").length; .. 프론트앤드 이야기/JavaScript & JQuery 2018. 6. 30.