- javascript
- css3 셀렉터
- supervisor
- 컨텐츠 중간 위치
- displaytable
- dom event
- jQuery
- Git
- findindex
- 관계형 데이터 베이스
- 배열 메소드
- unobtrusive javascript
- mysql
- nodejs
- ajax
- ecmascript method
- CSS
- ecma6
- body-parser
- 마임타입
- css3 selector
- javascript 이론
- array method
- requirejs
- database 개념
- 미들웨어
- ecma script
- IIS 서버
- 겸손한 자바스크립트
- express 서버
목록Javascript (21)
Martin`s Work
Jquery를 이용한 Object비교 Jquery에서 같은 Object를 비교하더라도, 계속해서 다르다고 나올 경우가 있다. 123456 객체 비교 console.log( $(".div") == $(".div")); //false console.log( $(".div") === $(".div")); //false Colored by Color Scriptercs 위의 소스를 볼때, 같은 Object를 비교하는데도, 실제 비교를 하면 flase값이 나온다. Jquery를 이용하면 해당 노드에 대한 정보가 배열로 해서 저장이 되는데, 이 배열에서 해당 노드에 대한 정보만 뽑아와야한다. 12345678910 객체 비교 console.log( $(".div")[0]==$(".div")[0]); //true co..
Select태그 관련한 기능 jquery에서 select태그에 기능을 넣기 위해 Selctor의 Dom을 가져오기 위한 몇가지 방법이 있다. 실제 이러한 방법을 쓰는 경우를 써야하는 경우는 여러가지 이유가 있겠지만, 그 중 하나로는 디자인 Select박스를 써야하는 경우가 있다. 단순 css만 이용하는 경우(:checked 속성)는 하위 브라우저에서 호환성 문제가 되어 이러한 경우 스크립트로 처리해야한다는 상황을 가정하에 작업한다. 현재 선택된 option의 값 가져오기 아래와 같이 select의 자식들 option에게 value 값을 부여하지 않으면 선택1, 선택2, 선택3 등과 같은 option의 innerText를 가져오게 된다. 12345678910111213 선택1 선택2 선택3 var sele..
프로토타입의 개념 자바스크립트는 자바, C++, C#에서 제공하는 것과 같은 실제 클래스(true class)를 지원하지 않는 대신 모조 클래스(pseudoclass)를 정의할 수 있다. 모조클래스는 프로토타입 객체나 생성자 함수를 사용하여 구현할 수 있다. 자바스크립트의 모든 객체는 프로토타입이라고 불리는 또 다른 객체를 내부적으로 참조할 수 있다. 그리고 객체는 프로토타입의 프로퍼티들은 자신의 프로퍼티로 가져온다. 123var a = new Date(); Colored by Color Scriptercs 예를 들어서, 위와 같이 a 객체를 Date() 라는 생성자 함수를 이용하여 만들 경우, new 연산자는 객체a 의 프로토 타입을 설정하게 되는데, 객체 a 의 프로토 타입은 자신을 만들어낸 생성자 ..
event.which Javascript에서 event.keyCode 를 하면 각 키보드에 해당하는 고유 번호를 알수있다.이 메소드가 Jquery에서는 event.which 으로 사용하게 된다. 1234$(document).keydown( function(event){ console.log(event.which);}) Colored by Color Scriptercs 위의 식대로 사용할 경우 각 키보드의 고유 번호를 알수 있으며, keydown 이벤트 외에도 사용할 수 있다.
정규표현식의 개념 정규표현식(영어로 regular expression, 간단히 regexp 또는 regex) 또는 정규식은 특정한 규칙을 가진 문자열의 집합을 표현하는데 사용하는 형식 언어이다. 정규 표현식은 많은 텍스트 편집기와 프로그래밍 언어에서 문자열의 검색과 치환을 위해 지원하고 있다. -위키 백과- 정규표현식은 조건에 맞는 문자열을 검색/치환/검사를 실행한다. 정규표현식의 3대 요소는 대상/조건/결과(실행) 이다. 정규표현식의 범주 1. 대상(정규표현식이 적용될 문자열)대상은 검색/치환/검사의 대상이 되는 문자열 값이다. 2. 조건(대상에 적용될 정규표현식)문자열(대상)에 의도한 검색 조건을 포함한 정규표현식 3. 결과(실행)검색/치환/검사를 행하는 메소드를 의미하며, 조건에 맡는 결과값을 나타..
1. animationName CSS 애니메이션의 이름을 반환한다. Internet Explorer 기준 IE10 이상 브라우저부터 지원한다. 12345678910111213141516171819202122232425 #div1{ width:100px; height:100px; background-color:red; -webkit-animation-name:moving; -webkit-animation-duration:5s; animation-name:moving; animation-duration:5s; } @keyframes moving{ from{ width:100px; height:100px; } to{ width:200px; height:200px; } } @-webkit-keyframes mo..
1. newURL, oldURL URL의 뒤에 hash가 바뀔 때 해당 이벤트가 발생하며, newURL은 바뀐 새로운 URL을, oldURL은 바뀌기 전의 URL을 반환한다. 해당 프로퍼티는 onhashchange와 같이 쓰며, 단점으로는 IE에서는 지원하지 않는다. 12345678 버튼 var btn = document.getElementById("btn"); document.body.onhashchange= function(){ console.log("바뀐 URL은 " + event.newURL + ", 바뀌기 전의 URL은 " + event.oldURL); } Colored by Color Scriptercs
1. altKey, shiftKey, ctrlKey, metaKey 이벤트가 발생될때, 해당 키(alt, shift, ctrl, meta) 키가 눌렸는지 여부를 알 수 있다. button 프로퍼티와 다른점은 이 프로퍼티는 모든 타입의 마우스 이벤트에 대해 유효하다.(*Meta 키란? 윈도우 기준으로 윈도우 심볼이 박혀있는 키이다. 정확한 기능 및 의미는 모른다.) 1234567891011121314 var txt = document.getElementById("txt") txt.onkeydown = function(event){ if(event.altKey){ alert("알트키가 눌렸습니다.") } else if(event.ctrlKey){ alert("컨트롤키가 눌렸습니다.") } else if(ev..
1. preventDefault() 웹브라우저에서 제공하는 기본적인 이벤트를 수행하지 않도록 한다. 예를 들어, 태그의 경우 기본적인 기능이 하이퍼링크인데, 하이퍼링크 기능을 수행되지 않도록 해준다. 123456링크이동 function func(event){ event.preventDefault(); } Colored by Color Scriptercs 위의 소스처럼 preventDefalut()를 사용하면 a의 하이퍼링크 기능이 실행되지 않는다. 2.stopPropagation() 해당 기능을 이해하기 위해서는 버블링 효과에 대해서 이해를 해야합니다 1234567891011 버튼 var cnt = 0; function func(event){ cnt++; alert("cnt의 값은 " + cnt + "입..
1. bubbles 개념 : 해당 이벤트가 문서 트리를 따라 올라가 bubbling 효과가 나타나는지에 대한 Boolean 값으로 반환( stopPropagtion() 과 연관 ) 1234567버튼 function func(event){ console.log(event.bubbles) }Colored by Color Scriptercs 위의 소스대로 실행할 경우, a 버튼을 누를 경우는 true 값을, input 에서 포커스가 나갈때의 경우에는 false가 나온다. 2. cancelable 개념: 해당 Dom에 바인딩 되어있는 기본 이벤트가 preventDefault()로 취소가능한지 여부를 Boolean값으로 반환 1234567버튼 function func(event){ console.log(event..