The fourth day of learning YUI.Ext--Usage of dialog box Dialog_YUI.Ext related

使用方法：
1.加入YUI.Ext 库到你的web程序： 



2.加入样式表 CSS Style 。如果你是一个美工，最多打交道的地方，可能就是这几个文件：
 
 

 
 

3.加入一个holder.holder的意思是一个载体，JS处理好数据，转变成内容（Contents，文字、图片、表格等）放在这里,也可以理解为一个架子，承托所有内容。holder表现形式很简单，通常是几行div。 


4. Add the definition Dialog script and instantiate the Dialog:

// create the HelloWorld application (single instance)
var HelloWorld = function(){
// everything in this space is private and only accessible in the HelloWorld block
//Anything in this area is a private variable and can only be accessed in HelloWorld
var dialog, showBtn;

var toggleTheme = function(){
getEl(document.body, true).toggleClass('ytheme-gray');
};
// return a public interface
return {
init : function(){
       showBtn = getEl('goNextBtn'); //Bind a button
                                                                                                                                                                                                                                                               );

                                                                                                                                                   log ){ //Because it adopts singleton mode, it cannot be repeatedly instanced by new. This is a lazy way of making judgments.
                                                                                                                                                                                                                                                                             >                                                                                                                                         shadow:true,
minWidth:508,
shim: true,
autoScroll: false,
resizable:false,
     minHeight:300
    }); 🎜> Dialog.addButton('Exit', dialog .hide, dialog);
                                                                                                                                                                                                       . This pair of parentheses will not be executed if it is missing.
//Use onDocumentReady instead of windows.onload initializer. When the DOM is ready, there is no need to wait for images and other resources to be loaded; for a discussion of the two, please see here
YAHOO.ext.EventManager.onDiocumentReady(HelloWorld.init, HelloWorld, true);
Difficulty Analysis: Singleton Pattern Design Pattern Singleton

What is Singleton Pattern?

Anwser: Singleton Pattern is a very basic and important creation pattern. The responsibility of a "singleton" is to ensure that a class has one and only one instance, and to provide a global access point to access it.During the programming process, there are many situations where it is necessary to ensure that a class can only have one instance.

What are the benefits of singleton pattern?

Anwser: 1. Reduce the memory usage caused by new operation; 2. In JS, you can create your own namespace.

How to implement singleton mode?

Anwser:

In traditional programming languages, in order to have only one instance of a class, the easiest way is to embed a static variable in the class and set the variable in the first instance. And every time you enter the constructor, a check must be done. No matter how many instances the class has, static variables can only have one instance. To prevent the class from being initialized multiple times, declare the constructor as private so that only one instance can be created in a static method. Please see the following example:



Copy code