Creating Applications with Mozilla-Chapter 3. XUL Elements and Features- P1

Tham khảo tài liệu creating applications with mozilla-chapter 3. xul elements and features- p1, công nghệ thông tin, kỹ thuật lập trình phục vụ nhu cầu học tập, nghiên cứu và làm việc hiệu quả
Nội dung trích xuất từ tài liệu:
Creating Applications with Mozilla-Chapter 3. XUL Elements and Features- P1 Chapter 3. XUL Elements and Features- P1The XML-based User-interface Language (XUL) includes all of the basicwidgets you need to build application user interfaces. These interfacesinclude tabs, text areas, buttons, and menus, as well as handy interfaces youmay not have thought you needed, such as the widget or.Chapter 2 introduced some of the XUL elements that make up a window andbasic applications. This chapter examines XUL elements and features inmore detail, describing the rationale behind them, their look and behavior,and common usage. Though not comprehensive, the chapter provides morethan enough information about XUL to get you started on building your ownMozilla applications, particularly when used in conjunction with the XULreference in Appendix C.The elements described here, such as menus, buttons, trees, and boxes, areneeded in almost any type of application, and most of the examples aregeneric, so you can plug them into any application or customize them toyour needs. Weve packed a lot of information in this chapter and it will be auseful reference as you begin to develop your applications.3.1. The XUL Document ObjectAt the core of a XUL file is the document object. As in HTML,document is an object that represents the XUL document itself -- thecontent as opposed to the window that surrounds it. The documentprovides methods for getting individual elements, manipulating the structureof the document, or updating style rules.A document object provides methods such as getElementById,getElementsByTagName, createElement, andcreateTextNode for DOM querying and manipulation of the actualdocument. Further details about the DOM are available in Chapter 5.Other types of document objects include the width and height of thewindow, a popupNode property that accesses the elements currentlydisplaying a pop up (a XUL widget that attaches to another widget andappears above it holding some content), a tooltipNode property thataccesses the element currently displaying a tooltip, and adocumentElement property that accesses the body of the document:var docEl = document.documentElement;var secondLevelNodes = new Array( );for (var I=0; Ivar title = document.getElementById(bookTitle);It is possible to access document outside the current scope -- for example,the window that opened another one using window.opener:var title =window.opener.document.getElementById(bookTitle);3.1.1. XUL Parsing and the Document Object ModelMozilla runs XUL documents through the Expat XML parser to check thatthey are well-formed. Expat is an XML parser library, written in C, that wasintegrated into Mozilla at the early stages of the code rewrite when thesource was made open.During parsing, a content model based on the Document Object Model(DOM) is built, allowing access to the content in a way that facilitatesdynamic manipulation. Once the XML tags are in the correct namespaces,Mozilla parses the document a second time to ensure that XUL tagsthemselves are valid. If this fails, or if the document does not conform to thesyntax rules, an error appears in your window so you can address theproblem.The parsing process builds an internal tree structure that can be used as ahandle for querying, modifying, and copying documents the structurerepresents. Chapter 5 describes in more detail the relationship betweenJavaScript (the main scripting engine used in Mozilla) and the DOM, and itgoes further with examples of commonly used methods for querying andmodifying a XUL document. To view that internal tree, you can use a toolcalled the DOM Inspector, which is a Mozilla application that lets you viewand manipulate the document object model of any XUL file or web page.For more information about the DOM Inspector, see Appendix B.3.2. Application Windows is just one of the possible root elements of a XUL document, theothers being , , , and .Overlays play an especially important role in managing and modularizingthe code in your XUL application, so the section Section 3.11, later in thischapter, is dedicated to them.The remaining root elements all have the XUL namespace and XUL windowattributes and properties. All have a XUL document object. Yet, addedfeatures exist for each. Which element you choose for the XUL documentdepends on the purpose of the window. A is typically top-level,a is secondary, appearing above another window, a isa document that appears in a frame, and a stores a set ofsubsections for loading one at a time through a step-by-step process.3.2.1. DialogsDialogs usually carry out specific functions like displaying a message orgetting information from the user. The element was createdrelatively late in the XUL toolkit development cycle to cater for somespecial needs of dialog windows, including their position relative to otherwindows (particularly the main application window) and the existence ofbuttons for accepting or rejecting a particular operation. A dialog in XULappears in Example 3-1.Example 3-1. XUL dialogAs you can see, the dialog includes the XUL namespace and the id andtitle attributes. However, some attributes, such as buttons andbuttonpack, dont appear in a regular window context.Dialogs commonly require the user to take some action or make a choice, sothe button attributes are provided for this purpose. In addition to buttonsand buttonpack, there are special event handlers on the dialog element --ondialogaccept, ondialogcancel, and ondialoghelp -- thatcorrespond to the buttons typically displayed and can execute code inresponse to user input. As with onunload, you can place a function in theondialogaccept event handler that executes when the user clicks theOK button: ondialogaccept=doCacheFlush( );>3.2.2. PagesThe element is designed specifically for documents ...