Ext 시작 1

3707 단어
프로젝트에서 Ext를 사용했습니다. 그 전에 진도를 맞추느라 바빴고 마음을 가라앉히지 않고 이것을 열심히 공부했습니다. 모두 ext를 할 줄 아는 동료가 개발 페이지를 조작했습니다.이제 공부를 좀 해야겠어요.아래의 부분은 전재하여 베낀 것이다.
Ext 공식 다운로드 사이트 Exthttp://extjs.com/download
Ext.onReady는 당신이 접촉하는 첫 번째일 수도 있고 모든 페이지에서 사용해야 할 방법일 수도 있습니다.이 방법은 DOM 로드가 모두 끝난 후에 페이지 내의 모든 요소가 Script 참조(reference) 후에 호출될 수 있도록 합니다.

Element:Ext의 핵심


대부분의 자바스크립트 작업은 당신이 실질적인 일을 할 수 있도록 페이지의 어떤 요소에 대한 인용 (reference) 을 먼저 받아야 한다.ID를 통해 Dom 노드를 가져오는 기존 JavaScript 방식:
   var myDiv = document.getElementById('myDiv');

이것은 아무런 문제가 없지만, 이렇게 단지 하나의 대상(DOM 노드)만 되돌려주는 것은 그다지 실용적이고 편리하지 않다.그 노드로 일을 하기 위해서는 많은 코드를 수작업으로 작성해야 한다.또한 서로 다른 유형의 브라우저 간의 차이는 처리하기에는 정말 헤프다.
Ext.element 객체로 이동합니다.원소(element)는 확실히 Ext의 심장 지대이다. 원소(elements)에 접근하든 다른 동작을 완성하든 모두 그것과 관련된다.Element의 API는 전체 Ext 라이브러리의 기반입니다.
ID에서 다음과 같은 Ext Element를 가져옵니다. var myDiv = Ext.get('myDiv');
  • Element는 흔히 볼 수 있는 DOM 방법과 속성을 포함하고 신속하고 통일된 브라우저 인터페이스를 제공한다(Element.dom를 사용하면 밑바닥 DOM의 노드에 직접 접근할 수 있다)
  • Element.get() 방법은 캐시(Cache)를 내장하여 같은 대상에 여러 번 접근하는 효율에 큰 장점을 가진다
  • 자주 사용하는 DOM 노드의 동작을 내장하고 크로스 브라우저의 위치, 크기, 애니메이션, 드래그 등(add/remove CSS classes,add/remove event handlers,positioning,sizing,animation,drag/drop)입니다
  •              myDiv.highlight();      // 
                 myDiv.addClass('red');  //  CSS  ( ExtStart.css )
                 myDiv.center();         // 
                 myDiv.setOpacity(.25);  //  

       

    여러 DOM 노드 가져오기


    일반적으로 DOM 노드를 여러 개 가져오려면 ID에 의존하기 어렵습니다.아이디를 설정하지 않았거나 아이디를 몰랐거나 아이디로 너무 많은 요소를 인용했을 수도 있습니다.이 경우 요소를 가져오는 근거로 ID를 사용하지 않고 속성 (attribute) 이나 CSS Classname으로 대체할 수 있습니다.이상의 이유로 Ext는 DomQuery라는 매우 강력한 Dom Selector 라이브러리를 도입했다.
    DomQuery는 별도의 라이브러리로 사용할 수 있지만 Ext에 자주 사용됩니다. 컨텍스트 환경(Context)에서 여러 요소를 가져와 Element 인터페이스를 통해 호출할 수 있습니다.기쁘게도 Element 객체 자체에 Element가 있습니다.내부 호출 DomQuery 선택 요소를 검색하는 selcect 방법입니다.
    //각 세그먼트는 Ext.select('p')를 강조 표시합니다.highlight();
         Element.이 예에서 select의 편리성은 의심할 여지없이 드러난다.이것은 요소 인터페이스(Element interface)를 통해 모든 요소에 접근할 수 있는 복합 요소를 되돌려줍니다.이렇게 하는 장점은 모든 원소에 순환하지 않고 접근하지 않는 것이다.
    DomQuery의 선택 매개 변수는 W3C CSS3 Dom 선택기, 기본 XPatch, HTML 속성 및 그 이상을 포함하는 긴 배열일 수 있습니다.

    좋은 웹페이지 즐겨찾기