`
黑鸟酱
  • 浏览: 127280 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

Dojo学习笔记(一)

 
阅读更多

创建一个HelloWorld级别的Dojo 表单Demo有一下几个步骤:

  1. 在<head>部分添加标准的Dojo首部(路径根据自己本地目录修改)
    <style type="text/css">
            @import "../lib/dojoroot/dijit/themes/tundra/tundra.css";
            @import "../lib/dojoroot/dojo/resources/dojo.css"
    </style>
    <script type="text/javascript" src="../lib/dojoroot/dojo/dojo.js" 
        	djConfig="parseOnLoad: true"></script>
     
  2. 将<body>标签的class属性设置为一种Dijit主题(应用了tundra主题)
    <body class="tundra">
     
  3. 根据需要的组建添加dojo.require语句(使用了4种组件)
    <script type="text/javascript">
    	    dojo.require("dojo.parser");
    	    dojo.require("dijit.layout.ContentPane");
    	    dojo.require("dijit.layout.TabContainer");
    	    dojo.require("dijit.form.ValidationTextBox");
    	    dojo.require("dijit.form.DateTextBox");
    </script>
  4. 在html中添加组件属性
    <div class="formContainer" dojoType
     ="dijit.layout.TabContainer">
    		<!-- Personal Data -->
    		<div dojoType="dijit.layout.ContentPane" title="Personal Data">
    		 	<label for="first_name">First Name:</label>
    	    	<input type="text" name="first_name" id="first_name" size="30" 
    	    		dojoType="dijit.form.ValidationTextBox" trim="true" propercase="true" required="true" invalidMessage="You must enter     your first name"/><br/>
    		    <label for="last_name">Last Name:</label>
    		    <input type="text" name="last_name" id="last_name" size="30"  /><br/>
    		    <label for="middle_initial">Middle Initial:</label>
    		    <input type="text" name="middle_initial" id="middle_initial" size="1" /><br/>
    		</div>

在Dojo中存在两种使用Dijit组件的方式;

  1. 声明式:
    <div class="formContainer" dojoType="dijit.layout.TabContainer">
  2. 组件式:
    var programmticPane = new dijit.layout.ContentPane(
         { href: 'http://www.yahoo.com'}
    );

上面的HelloWorld采用的是申明式的方式。

 

在本地用FireFox直接打开html文件时,有可能会出现:

Could not load 'dojo.parser'; last tried './parser.js'

 是由于火狐默认情况下不允许本地文件加载js脚本:

  1. about:config
  2. security.fileuri.strict_origin_policy
  3. need to be set to false
  4. to be able serve from filesystem

 

分享到:
评论

相关推荐

    DOJO 学习笔记 dojo

    Dojo 是一个功能丰富的 JavaScript 库,它提供了一系列模块化、面向对象的工具,用于构建高性能的 Web 应用程序。在 Dojo 中,模块和包的概念是核心组成部分,它们帮助开发者组织和管理代码,使其更易于维护和重用。...

    dojo学习笔记

    Dojo 是一个强大的JavaScript工具库,它为Web开发提供了丰富的功能和组件,包括AJAX、DOM操作、动画...在“dojo学习笔记”中,你可能找到了关于这些概念的详细讲解和实践案例,这对理解和掌握Dojo技术体系非常有帮助。

    dojo精品中文教程(包一)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo精品中文教程(全)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo精品中文教程(包二)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo精品中文教程(包三)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo学习笔记(web编程必备)

    【Dojo 学习笔记】 Dojo 是一个强大的JavaScript工具库,特别适合于Web编程,尤其在面向对象的JavaScript编程方面表现出色。学习Dojo之前,建议先掌握JavaScript的面向对象编程基础,这对于理解Dojo的源码和设计...

    dojo 学习笔记 表单 树形列表

    和前一个树形菜单 大多数例子是基于 PHP 的 发现很多 dojo 学者想下载 dojo 的API…… 结论是:下不到的! 发现很多想下载一些帮助例子,在http://download.dojotoolkit.org/ 下才能找到,进去点版本,比如 ...

    dojo源文件+学习笔记

    这个压缩包包含了Dojo的源代码和相关学习笔记,旨在帮助开发者深入理解Dojo的工作原理和使用方法。 1. **Dojo 源代码解析**: Dojo 的源代码是用JavaScript编写的,并遵循AMD(Asynchronous Module Definition)...

    Dojo简单笔记和权威学习去处

    首先,"dojo文档.doc"可能是作者整理的个人学习笔记,通常这样的文档会包含对Dojo核心概念的理解、常用函数和方法的解释、实例代码以及可能遇到的问题解决方案。个人笔记是学习过程中宝贵的经验总结,可以帮助快速...

    Dojo 教程 笔记 (转载)

    【Dojo 教程笔记】 Dojo 是一个强大的JavaScript工具库,它采用了面向对象的编程方式,对于熟悉JavaScript面向对象编程的开发者来说尤其有用。在开始学习Dojo之前,建议先掌握JavaScript的基础知识,特别是面向对象...

    推荐dojo学习笔记

    ### Dojo框架学习笔记 #### 一、Dojo框架简介 Dojo是一个开源的JavaScript库,主要用于构建高性能的Web应用程序。它提供了一系列的功能强大的工具,包括DOM操作、AJAX、事件处理、用户界面控件等,使开发者能够...

    Dojo的一些学习资料

    在"dojo学习笔记.pdf"中,你可能会学习到如何导入Dojo,如何使用模块系统,以及一些基本的Dojo API。"Dojo快速入门.pdf"可能会介绍Dojo的安装、配置过程,快速上手的方法,以及Dijit组件的初步使用。最后,"dojo组件...

    Dojo 学习笔记入门篇 First Dojo Example

    《Dojo 学习笔记入门篇 - 首个Dojo示例解析》 Dojo是一个功能强大的JavaScript工具包,它提供了丰富的UI组件、模块化系统、数据存储以及Ajax等功能,广泛应用于Web开发中。本篇文章将引导你完成Dojo的基础配置,并...

Global site tag (gtag.js) - Google Analytics