목록WEB/JAVASCRIPT (41)
Knowledge Map
div 스타일 width 50%로 주고 그 안에 span 태그 값 50개를 넣어봤다. 일반적으로 이럴경우 width 50% 값에 대해서 넘을 경우 자동으로 아래로 내려간다. 하지만 javascript dom 객체를 이용해서 추가할 경우 이것을 무시하고 그냥 옆으로 죽 간다. 이럴때 사용하기 적절한 것은 display : inline-block; 을 쓰거나 table -cell 을 쓰는 것이다.
주말부터 javascript 패턴에 대한 책도 쉬엄쉬엄 읽고 있는데 거기서 javascript의 문서화에 대한 항목이 나왔다. 나는 가벼운 마음으로 javascript 문서화를 한번 해보기로 마음을 먹었는데 그것이 삽질의 시작이 될거라고는 생각을 못했다. 일단 내가 시도해본 javascript 문서화 도구는 이러하다. 1. YUIDOC 2. JSDOC 또는 여기 3. GROC ( 이건 차라리 [ 여기서 ] 보고 따라하는게 더 좋다.) 4. ESDOC 결론부터 말하자면 1,2,3,4 전부다 잘 작동한다. 1. YUIDOC는 문법을 많이 따지고 특히 Class구현부터 잘 되어 있는 JS 모듈의 경우에는 잘 작동하지만 Function만 있는 간단한 JS파일에서는 제대로 작동이 안되었다. 그래서 하다가 그냥 멈..
자바스크립트는 배울수록 독특하고 재미있는 언어이다. 생각보다 자기 개성을 강하게 가지고 있기도 하고. 자유롭기도 하고. 그런 생각이 들게 만들었던 것들중 하나가 arguments이다. 함수를 호출할 때, 인수들과 함께 암묵적으로 arguments 객체가 함수내부로 전달된다.이 arguments 객체는 함수를 호출할 때 넘긴 인자들이 배열 형태로 저장된 객체를 의미한다.다만 이 배열이라는게 실제 배열이 아닌 유사 배열 객체이다. 이것에 대한 자세한 내용은 '인사이드 자바스크립트'에 잘 나오니 참고 하시기 바라고 이제 코드를 한번 보자. argTest라는 함수가 있다. 하지만 이것은 따로 받는 인자가 없다.HTML코드의 input 태그에는 onclick으로 함수를 호출할때 인자가 존재한다.. 그것도 하나가 ..
javascript - this1
Javascript 에서 This는 해당 메서드를 호출한 객체로 바인딩된다. 코드를 보면 Javascript 함수가 3가지있다. (FirstValue, SecondValue, ThirdValue)이 3가지 함수안에 alertValue라는 함수를 다시 넣었다. 그런 다음 console.dir을 실행시켜서 FirstValue() 함수 내부의 정보 및 프로퍼티를 로그를 찍어 보았다. 위의 코드와 비교를 해보면 FirstValue() 안에 있는 context1이 없다. 이것은 당연한 이야기인데 변수로 선언되는 것이기 때문에 실행 전에는 존재할 수가 없는 것이다. 따라서 로그에 나오지 않는다. 다만 FirstValue.propertyTest 는 나오는데 이것은 함수 내부에 프로퍼티를 생성했기 때문이다. 그외에 a..
출처 : 인사이드 자바스크립트 자바스크립트에서 함수는 일급객체 이다. 일급객체(First Class)인 함수 Function은 아래와 같은 동작이 가능하다. 리터럴에 의해 생성 변수나 배열의 요소, 객체의 프로퍼티 등에 할당 가능 함수의 인자로 전달 가능 함수의 리턴값으로 리턴 가능 동적으로 프로퍼티를 생성 및 할당 가능 따라서 일급객체인 특성을 가지고 있는 자바스크립트 함수는 함수형 프로그래밍이 가능하다. 여기서 숫자, 문자열, 불린값, null undefined 는 기본타입으로 '값에 의한 호출' Call By Value 방식으로 동작하고그 외에는 참조타입으로 '참조에 의한 호출' Call By Reference 방식으로 동작한다. 클로저가 왜 필요한지 그 이유는 많지만 그 중 하나만 보자면 자바스크..
http://qnibus.com/blog/how-to-access-to-iframe-from-parent-window/ http://m.mkexdev.net/75 팝업을 띄운 부모 브라우저(?)는 첫번째 링크의 opener를 사용해보면 된다.즉 opener.document.location.href 이런식으로 쓰면 거기로 이동한다. 여기서 조금만 응용해 보면 된다.
12345678910111213141516function createForm(number) { var test = document.getElementById("option").value var form = document.createElement("form"); form.setAttribute("method", "POST"); form.setAttribute("action", "../abcabc/index.html?pageno="+number); var hiddenField = document.createElement("input"); hiddenField.setAttribute("type","hidden"); hiddenField.setAttribute("name","option"); hiddenFie..
옛날 게시글 중에 커스텀 오른쪽 마우스 메뉴 라는 글이 있었다. 그때는 외국 소스 설명 보면서 하다가 막혀서 일정은 맞춰야 하겠고 시간은 없고 해서 그냥 복붙해 버렸었다. 그리고 시간이 지나가면서 마음속에 계속 찜찜함을 가지고 있었다. 그런데 그저께 회사 동료랑 이야기 하다가 그렇게 복붙 하는 것은 '코더'들이나 하는 짓이라고 그러면 실력 하나도 안 느니깐 절대 그렇게 하지말라는 충고를 듣게 되었다. 그래서 금욜 퇴근하고나서 부터 복붙하지 말고 내 힘으로 해보자고 마음먹고 다시 짜보았다.이전소스를 IE9,10,firefox까지 크로스 브라우징 하면서 소스 분석한게 도움이 컸다. 참고로 이 소스는 크로스 브라우징은 안되어 있다.
event.toElement 이것은 IE8, firefox에서는 먹히지 않는다.이럴때에는 event.target을 쓰면 된다.http://stackoverflow.com/questions/8600174/event-toelement-in-ie8-and-firefox addEventListener 이것은 IE8에서 먹히지 않는다.이럴때는 attachEvent를 쓰면된다.하지만 이것은 엘리먼트 값 대신에 window객체의 레퍼런스 값을 가지고 온다고 한다. (그래서 걍 ie9 부터 지원하자고 설득)http://stackoverflow.com/questions/9769868/addeventlistener-not-working-in-ie8 https://developer.mozilla.org/ko/docs/Web..