가카리의 공부방

$.extend 메소드는 어떤 객체에 속성을 추가해주는 메소드입니다. 간단하니까 다음의 예제를 보면 이해가 되실 겁니다. DOCTYPE html> Insert title here $(document).ready(function(){ var object = {name: '윤인성'}; //객체에 속성들을 추가하게됨 $.extend(object, { region: '서울특별시 강서구', part: '세컨드 기타' }); var output = ''; //$.each 메소드로 출력해봄 $.each(object, function(key, item){ output += key + ': ' + item + '\n'; }); alert(output); }); 실행화면

이전에 사용한 $.each 메소드를 통해서 배열을 관리했는데요 이번에는 내부 파라미터인 index와 item을 사용하는 방법을 알아봅시다. 아래소스는 h1으로 item-0부터 4까지 있는데 그것을 high-light-0부터 4까지의 css를 적용하는 소스입니다. 이를 위해서 $('h1').each(function(index, item)에서 수행하는데 여기서 h1은 body 내부의 h1을 의미합니다. 그리고 addClass()를 통해서 css클래스를 적용하게됩니다. DOCTYPE html> Insert title here .high-light-0 {background: yellow;} .high-light-1 {background: orange;} .high-light-2 {background: blue;..

자바스크립트에서 배열에 들어 있는 내용을 HTML 페이지에 표시하기 위해서 $,each 메소드를 사용하는 법을 봅시다. 다음과 같이 array를 선언후 for문처럼 사용하는 $.each 메소드를 통해서 모든 name과 link 항목을 innerHTML 시키는 예제입니다. DOCTYPE html> Insert title here $(document).ready(function(){ var array = [ {name: 'hanbit', link: 'http://hanb.co.kr'}, {name: 'daum', link: 'http://daum.net'}, {name: 'naver', link: 'http://naver.com'} ] $.each(array, function(index, item){ var..

DOM LEVEL2 이벤트 모델에서는 DOM LEVEL0이벤트에서와는 달리 여러 번 이벤트를 추가가 가능하다는 점입니다. 인터넷 익스플로러에서는 attachEvent 로 이벤트를 추가하고 detachEvent로 이벤트를 삭제하고 그 외 브라우저에서는 addEventListener로 이벤트를 추가하고 removeEventListener로 이벤트를 삭제합니다. 예제 소스 DOCTYPE html> Insert title here window.onload = function(){ var header = document.getElementById('my-header'); if(header.attachEvent){ //인터넷 익스플로러 일 경우 실행 var handler = function(){ window.eve..

보통은 Visual Studio 6.0 에 OpenGL 개발환경을 구축하여 사용하는게 가장 많을것 같다. 하지만 Visual Studio 6.0 의 버그들... 그리고 Resource 관리.. 등이 좋지 않아.. Visual Studio 2008 에서 OpenGL 을 개발하려고 한다. 우선 첨부파일 다운~~ 1. C:\Program Files\Microsoft Visual Studio 9.0\VC\include 위치에 gl 폴더를 생성 2. 압축푼곳의 Header 폴더의 파일들을 gl 폴더에 복사 3. C:\Program Files\Microsoft Visual Studio 9.0\VC\lib 위치에 Lib폴더(압축파일)의 파일을 복사 4. 마지막 Dll폴더(압축파일) 의 파일들을 C:\Windows\S..

이벤트 버블링이란 이벤트가 자식부터 부모까지 계속 실행되는 것을 말한다. DOCTYPE html> Insert title here window.onload = function(){ } * {border: 3px solid black;} Pagagraph 위와 같은 소스의 경우 pagagraph 다음 header 다음 inner-div 다음 outer-div 순으로 실행이 될 것이다. 만약 이벤트 버블링을 막고 싶다면? 다음과 같이 인터넷 익스플로러 : 이벤트 객체의 cancelBubble 속성을 true로 바꿈 그 외 브라우저 : 이벤트 객체의 stopPropagation() 메서드를 사용 으로 막습니다. DOCTYPE html> Insert title here window.onload = functio..

문서 객체 모델(DOM, Document Object Model)은 document 객체와 관련된 객체의 집합입니다. 문서 객체 모델을 사용하면 HTML 페이지에 태그를 추가 수정 제거 할 수 있습니다. 다음은 이 문서 객체 모델을 이용한 글자들의 움직임을 만든 예제입니다. DOCTYPE html> Insert title here //랜덤한 정수를 생성 function nextRandomInteger(limit){ return Math.round(Math.random() * limit); } //랜덤한 알파벳을 리턴 var alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; function randomAlphabet(){ return alphabet.charAt(nextRandomI..

문서 객체 모델(DOM, Document Object Model)은 document 객체와 관련된 객체의 집합입니다. 문서 객체 모델을 사용하면 HTML 페이지에 태그를 추가 수정 제거 할 수 있습니다. 다음은 간단히 document 객체를 활용한 회전하는 글자라는 예제입니다. DOCTYPE html> Insert title here window.onload = function(){ //변수 선언 및 문서 객체를 가져오기 //이때 ID로 가져온다 var sun = document.getElementById('sun'); var earth = document.getElementById('earth'); var moon = document.getElementById('moon'); //문서 객체의 스타일 속..

안녕하세요~!! 오늘 포스팅할 내용은 SQL AS 구문입니다. as 구문은 테이블 또는 테이블의 열에 대해서 임시로 이름을 변경할 수 있습니다. 약간 말이 어려운데 예제를 보면 금방 이해가 되지 않을까 싶습니다. 아래 member 테이블이라고 가정하고 예제를 살펴보겠습니다. id user_id user_pwd name age phone email 1 hhhh 1111 홍길동 25 010-1111-1111 test1@test.com 2 aaaa 2222 임꺽정 45 010-2222-2222 test2@test.com 3 bbbb 3333 이영수 34 010-3333-3333 test3@test.com 4 cccc 4444 김영희 28 010-4444-4444 test4@test.com 5 eeee 5555..

HTML을 이용한 공격 방지 HTML을 사용자가 이용하게 된다면 일부 불순한 생각을 가지신분이 자신의 실력을 돋보이게 하기위해서 종종 자바스크립트를 이용한 테러를 하게 됩니다.(무한 팝업 등) 그런 것을 방지하기위해서는 한가지 방법이 있습니다. 방법은 HTML과 자바스크립트를 무시하는 것입니다. 첫 번째 방법을 위해서는 PHP 내장함수중 strip_tags라는 함수를 알아야되는데 이 함수는 문자열에서 태그를 제거하는 함수입니다. $stirng = strip_tags(" PHP"); 를 쓰면 $string에는 “PHP”만 들어가게 됩니다. 만약에 $stirng = strip_tags(" PHP", " "); 과 같이 두 번째 인자에 를 넣게되면 은 허용한다는 뜻입니다. 그래서 $string에는 “ PHP”..