Tutorial:Ext로 재생 Easy Way(EXT 간단한 방법) --firebug 디버깅 ext
Tutorial:Ext로 재생 Easy Way(EXT 간단한 방법) --firebug 디버깅 ext
금요일, 12/21/2007 - 02:45 - ppkosd67
vote
비틀거리며 걸음마를 배우다
첫 번째 단계 - 시작
Ext, 온라인 프레젠테이션 탐색, API 문서 읽기 등을 이미 들어보셨을 것입니다.그러나 복잡한 API 문서에 대해 어떻게 손을 대지 않으십니까?!
2단계 - 시작
API 문서를 통람하고 즉시 시도해야 할 기능을 찾았습니다. 혼잡한 웹 소스 코드에 직면하여 어떻게 간단한 테스트 페이지를 시작합니까?그럼...
목표가 무엇이든지 본문에 따라 Ext를 빠르게 사용할 수 있습니다.아니오, 서버를 만들 필요가 없습니다. Firefox 브라우저와 Firebug 디버그 플러그인만 필요합니다.만약 아직 설치되지 않았다면, 지금이 좋은 기회이다.
Firebug 사용 강좌
우도소시
Ext.get(document.body).update('<div id="test"></div>');위의 코드는 현재 DOM body 요소를 하나의 ID로 test의 div 요소로 대체하는 역할을 합니다.방금 그 API 문서들은 삭제되었지만 Ext 코드는 여전히 적용되고 수시로 당신을 위해 노력합니다.
현재, 우리는 당신이 패널 요소(Panel)를 간단하게 추가하기를 원한다고 가정하지만, Ext.Panel의 API에 대한 번거로운 설명은 무력합니다.그러면 이 코드를 Firebug 콘솔에 추가해 보십시오.
Ext.get(document.body).update('<div id="test"></div>');
new Ext.Panel({ renderTo: 'test',
width: '200px',
title: 'My Title',
html: 'My HTML content' });Ctrl-Enter를 다시 클릭합니다.어이!패널 요소가 생성되었습니다.
좋아요. 그런데 옵션을 좀 수정하면요?아까 코드를 다음 코드로 대체합니다.
Ext.get(document.body).update('<div id="test"></div>');
new Ext.Panel({ renderTo: 'test',
width: '200px',
title: 'My Title',
html: 'My HTML content',
collapsible: true });Ctrl-Enter 를 클릭합니다.어때, 신축할 수 있는 판넬이 하나 배치됐어.(패널의 오른쪽 위 모서리에 있는 작은 아이콘 참고)
Ctrl-Enter를 두드릴 때마다 첫 번째 줄의 코드가 기존 내용을 제거합니다. 그러면 깨끗한 디버깅 환경을 만들 수 있습니다.이것은 간단한 팁입니다. 여러 가지 설정 옵션을 시도하는 데 매우 편리합니다.
업데이트 () 함수에 필요한 HTML 코드를 얼마든지 추가할 수 있습니다.그리고 Ext API를 탐색하기 위해 많거나 적은 Javascript를 작성합니다.
뭘 더 기다려?지금 바로 Ext Api를 직접 실천하세요.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
