Learn the basics of Yui.ext first day _yui. Ext Related

Source: Internet
Author: User
Tags unpack
Introduction

Turned over the old posts, there are memorable places to share:

Post1:


.................
We now have a large number of applications rely on the browser (mainly IE) script processing capabilities, on some old machines are actually slightly slow to run, but the current mainstream models to deal with no problem. We have designed a set of WEB development frameworks that will become more stable as the application is tempered. JavaScript use is not easy to cause IE crash, we rely on increasing the degree of reuse of code to solve this problem, because the higher the degree of reuse of the code is often more stable. Some yangaoshoudi tend to ignore JavaScript entirely from the overall solution at first glance, but we find JavaScript as the presentation layer of the solution very valuable, and through the mapping of several layers of DOM trees to solve the presentation layer-logical layer separation than using MVC Be much more flexible. Our basic idea is that the browser-the transfer between the server should be just data, how to display (rendering) by the browser itself. Our middleware is a good embodiment of this idea. The learning cost of MVC is also an important factor to consider. I can say without blushing that I don't understand MVC, but we do solve the problems that our clients need us to solve.
.................

Post2:

.................

Through our more than a year of XMLHTTP, Javascirpt, RIA and other technical and architectural discussions, in fact, we can finally get the exact same conclusion. The feasibility of AJAX is beyond doubt, and has been the experience of some of our courageous developers here (my experience, there are many people who use JS+XMLHTTP+XSLT experience, to put a little gold on their faces, hehe), and the recent Google Map and other great applications (experience The speed of Google Map, you know why I said it's great. It also confirms that innovation based on WEB standards is a bright road. My colleague, Ly, adopted this development model three years ago and introduced its benefits to me, and I've been here again and again to promote the benefits of using js+xmlhttp for development. So I'm not surprised by the AJAX that's happening now, but it's just a bit of a shame that this development pattern is starting to get popular now. In the past, most of the developers only know blindly to superstition, superstition. Net, to limit themselves to the cynics-style of the factory blindly, and not willing to innovate. AJAX now appears to be a revelation and a lesson to domestic developers. Communism cannot wait, neither m$, IBM or Sun will cede the happy life of communism. Not the technology itself (for example, in some people seem to have been completely outdated technology html/css/javascript), in fact, people do not, no good technology to you can not do good things. I'm more bullish on this than proprietary solutions like XAML or Flash. The combination of these technologies now that we have a new name for Ajax, we'll call these technologies Ajax in the future.

.................

---this is a piece of Dlee's 2004 in Javaeye's post, and the significance of that time can now be said to have been proved feasible---hereby lend an introduction to the text.

The following author is Brian Moeskau, translator: Frank's original source is here


Tutorial: Ext Introduction
Whether you are a novice ext library, or want to know ext people, the content of this article is suitable for you. This article will simply introduce some of the basic concepts of ext, and how to quickly make a dynamic page and run it, assuming that the reader has some JavaScript experience and a rudimentary understanding of the HTML Dom. Otherwise, start by reading your beginner JavaScript resources.

Download ext
Perhaps you have never downloaded, that should download the latest version of the Ext http://extjs.com/downloads.

For your download needs, there are several different flexibility options. Generally, the most stable version is the choice of more people. After the download unpack, that example folder is a good place to explore!

Begin!
We will use EXT to complete some of the common JavaScript situations.

The zip file includes three files: extstart.html, Extstart.js, and Extstart.css. Unpack these three files to Ext installation directory (for example, ext is in "C:\code\Ext\v1.0", that should be in "v1.0" inside the new Directory "tutorial". Double-click Extstart.htm, and then your browser opens the startup page, and there should be a message telling you that the configuration is complete. If it is a JavaScript error, follow the instructions on the page.

In your favorite IDE or text editor, open extstart.js to see:

Ext.onready may be the first way to contact you. This method means that all elements within the page can be script referenced (reference) after the current DOM is loaded. You can delete alert () and add some real-world code to try it:

Copy Code code as follows:

Ext.onready (function () {
Alert ("congratulations! You have Ext configured correctly! ");
});
The core of Element:ext
Most JavaScript operations need to get an element on the page (reference) so you can do interesting things. The traditional JavaScript method is to get the DOM node by ID:

var mydiv = document.getElementById (' mydiv '); This is no problem, but simply returning an object (DOM node) is not too powerful and easy to use. In order to do something with that node, you will have to write a lot of custom code, and in addition, the difference between different types of browsers, you have to deal with a really big head.

Enter the Ext.element object. The element is indeed the heart of ext--whether it is an access element (elements) or a complete action, it is involved. Element API is the basis of the entire EXT library, if you do not have much time, just want to know a class in Ext, element must be the first choice!

Get an EXT element by ID as follows (home extstart.htm contains a div,id name "Mydiv", then add the following statement to Extstart.js):

Ext.onready (function () {var mydiv = ext.get (' mydiv ');}); Look back at the element object and find out what interesting stuff it is.

element contains common DOM methods and properties, providing a fast, unified, Cross-browser interface (if you use Element.dom, you can access the nodes of the underlying DOM directly.) );
The Element.get () method has the built-in caching processing (cache), which has great advantage in the efficiency of accessing the same object multiple times.
Built-in common DOM node actions, and are positioned across browsers, size, animation, drag-and-drop, and so on (Add/remove CSS classes, Add/remove event handlers, positioning, sizing, Animation, Drag/drop).
This means that you can do all sorts of things with minimal code, and here is just a simple example (the complete list is in Elementapi).

To continue in the Extstart.js, in the location where we have just obtained good mydiv:

Copy Code code as follows:

Mydiv.highlight (); Yellow Highlight and fade back
Mydiv.addclass (' Red '); Add a custom CSS class (defined in Extstart.css)
Mydiv.center (); Center elements in view
Mydiv.setopacity (. 25); Make element Translucent

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.