文档章节

Dojo 基础入门(三)

w
 waking999
发布于 2017/05/24 13:32
字数 1247
阅读 4
收藏 0
点赞 0
评论 0

1.            开发环境准备

1.1.    开发环境

Dojo本身是由Javascript编写而成的,所以基于Dojo的扩展也是Javascript语言。目前,存在着一些支持Javascript语法高亮的编辑器,如UltraEdit, Notepad等。如果只是单纯的客户端用户界面的开发,完全可以采用编辑器+浏览器的方式,这样开发的执行效率最高,占用的系统资源最少。

当然了,如果需要后台数据支持、服务器端逻辑支持,那就需要考虑应用服务器、数据库等其他资源,这个时候一个集成开发环境(IDE)对我们的开发帮助就大有裨益了。由于工作原因,笔者使用的是IBM Rational开发平台,实际上根据需要选择带有插件功能的Eclipse平台就可以满足Dojo日常开发的要求了。在Dojo的官方网站推荐了几款其他的IDE工具,比如Aptana Studio等,它们各有利弊,开发者可以依据项目要求、个人使用习惯等选择相应的IDE工具。

1.2.    测试环境

由于Javascript是客户端的运行代码,所以测试的对象就是那些主流的浏览器。理论上说,在开发测试时,脚本程序要在各种浏览器上开发验证。但依据笔者的经验,在开发的过程中就以Firefox为测试目标, 测试成功的页面一起在IE中集成测试即可。

使用Firefox的另一个原因是在目前Javascript的调试还不是很发达的情况下,Firefox下的一个调试插件可以帮助我们做一些事情,它就是Firebug.

1.3.    Firebug

1.3.1.      下载

可以到Firebug的官方网站直接下载,网址是http://www.getfirebug.com。需要注意的一点是,由于FirebugFirefox的插件,所以需要使用Firefox访问该网址,直接点击Install Firebug按钮即可直接安装完成。

1.3.2.      常用功能的使用

1.3.2.1.            准备

首先需要在使用前把isDebug参数设置为true,这样可以打印出相应的信息。如果不希望出现这些打印信息,可以设置成false予以关闭。

<script type="text/javascript" src="../dojo.js"
        djConfig="parseOnLoad: true, isDebug: true"></script>

1.3.2.2.            记录日志

在需要打印信息的地方加入如下的执行语句,可打印出不同级别的信息。

console.log("Nothing happening");
console.debug("Checking to make sure nothing happened");
console.info("Something might happen.");
console.warn("Something happened, but it's no big deal.");
console.error("Cough cough!");

 

可以看到在FirebugConsole标签以上语句的执行效果以及该执行语句所在的文件以及行数。除此以外,你还可以到Dojo的核心库和Dijit组件的加载状态。

小提示

1.如果你不希望看到某些信息,可以通过右上角的Options选项予以过滤。

2.另一个比较值得一提的是console.dir()语句,这条语句对对象类型的变量打印比较直观。比如:

var btn=dijit.byId('helloBtn');

console.dir(btn);

 

3.此外,一些对象有其父对象或子属性对象,执行console的打印语句后,可以在Firebug的第一行发现对象的父子传递顺序,可以通过其中某一对象节点的链接直接索引到该对象。

1.3.2.3.            查看Html结构

由于一个用户界面系统的开发会涉及若干的htmljs文件,这些文件都可能含有构成用户界面布局的代码,如何可以直观地查看这些分散在不同角落的代码的html层级结构就成为了一个问题。而Firebug就提供了这样的功能。

切换到Html标签,我们就可以看到整个用户界面的html结构代码,它具有良好的树状格式,易于查看,而且选择html结构的某个节点时,其相对应的页面组件会变成蓝底高亮。同时该节点的样式属性参数也用列表的方式列于右侧。而其DOM形式的展现可以通过选择右侧的DOM标签予以查看。

1.3.2.4.            加断点

如果想要看到对象的状态、语句执行后的结果,除了使用打印语句,我们还可以使用Firebug提供的调试功能,比如断点。

切换到Script标签,可以在Firebug的第一行,选择希望加入断点的脚本所在文件。定位到某一行后,在该行号处点击左键即可实现断点的添加/删除功能。当语句执行到该处时,会出现黄色的箭头。

在第一行的右侧,还有Continue,Step Over,Step Into,Step Out等按钮以及快截键。右侧的下方Watch标签,显示了执行到该断点处的变量名/值的列表,我们也可通过New watch expression添加其他的变量或表达式。

 

 

 

本文转载自:http://blog.csdn.net/kswaking/article/details/2232674

共有 人打赏支持
w
粉丝 0
博文 23
码字总数 0
作品 0
澳大利亚
Dojo入门与dojo项目配置方案(一)

何为dojo Toolkit Dojo Toolkit(以下简称dojo)是一个javascript语言实现的、跨浏览器的DHTML(Dynamic HTML)工具包。Dojo ToolKit包括了构建大规模Ajax驱动的web应用程序所需要的一切。所...

tkorays ⋅ 2014/01/01 ⋅ 0

Dojo Mobile 1.7 入门

最新版的移动 Web 开发框架 Dojo Mobile 1.7,是 Dojo Toolkit 的一个扩展。本文将使您了解如何从主干网址下载 Dojo 1.7,以及如何在您的应用程序中使用 Dojo Mobile。您还将探索它提供的各种...

IBMdW ⋅ 2012/12/18 ⋅ 8

深入浅出 Javascript API(一)--基本框架

Javascript API是ArcGIS Server 9.3新增的一套API框架,为创建WebGIS应用提供了轻量级的解决方法,在客户端利用ags所提供的服务,就能实现地图应用和地理功能。 还记得ArcIMS Blueviewer示例...

文艺小青年 ⋅ 2017/03/02 ⋅ 0

手把手教你Dojo入门

如果仅仅是为了练习Dojo,或者进行测试,可以参考下面的步骤。下面的文件均是在Windows下测试 需要的工具 1 Tomcat服务器:下载地址 选择适合自己的机器型号,即可 2 Dojo的工具包:下载地址 ...

青夜之衫 ⋅ 2017/12/04 ⋅ 0

全面认识 Node.js

1. 了解 Node.js 从 Java 开发人员的视角了解什么是 Node.js(什么不是 Node.js),以及其工作原理和益处。然后,看看使用 Node 开发的 Web 应用程序是什么样的。 阅读: 面向 Java 开发人员的...

IBMdW ⋅ 2012/09/17 ⋅ 1

Dojo入门与dojo项目配置方案(二)

用了一段时间dojo后,渐渐发现它的强大。越来越喜欢它的一个函数是declare。Declare可以用来创建自定义类,以实现模块化设计。正是这种模块化的思想让dojo开发变得简便。这里面我介绍一个doj...

tkorays ⋅ 2014/01/05 ⋅ 0

面向对象的JavaScript框架--Dojo

Dojo是一个强大的面向对象JavaScript框架。主要由三大模块组成:Core、Dijit、DojoX。Core提供Ajax,events,packaging,CSS-based querying,animations,JSON等相关操作API。Dijit是一个可更换皮...

匿名 ⋅ 2008/09/05 ⋅ 6

dojo.mixin、dojo.extend、dojo.declare

dojo源码里,大量使用 dojo.mixin、dojo.extend、dojo.declare 三个方法。作用均为扩展dojo基类。 一、dojo.mixin dojo.mixin用于扩展一个实例对象,如 var obj = {a:1,b:2} dojo.mixin(obj...

bigYuan ⋅ 2012/04/13 ⋅ 0

dojo.mixin(混合进)、dojo.extend、dojo.declare

dojo源码里,大量使用 dojo.mixin、dojo.extend、dojo.declare 三个方法。作用均为扩展dojo基类。 一、dojo.mixin dojo.mixin用于扩展一个实例对象,如 var obj = {a:1,b:2} dojo.mixin(obj...

bigYuan ⋅ 2012/05/15 ⋅ 0

WEB前端工程师编程能力提升成长之路

【背景】 如果你是刚进入WEB前端研发领域,想试试这潭水有多深,看这篇文章吧; 如果你是做了两三年WEB产品前端研发,迷茫找不着提高之路,看这篇文章吧; 如果你是四五年的前端开发高手,没...

web前端03 ⋅ 05/10 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Spring Cloud构建微服务架构—创建“服务注册中心”

创建一个基础的Spring Boot工程,命名为eureka-server,并在pom.xml中引入需要的依赖内容: <parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-par......

itcloud ⋅ 17分钟前 ⋅ 0

拖动

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>event</title> <style> #box { width: 100px; height: 100px; background-color: aquamarine; position: absolute; } </style......

fyliujj ⋅ 20分钟前 ⋅ 0

es6 polyfill array

polyfill之javascript函数的兼容写法——Array篇 1. Array.isArray(obj) if (!Array.isArray) { Array.isArray = function(arg) { return Object.prototype.toString.call(arg) === '[objec......

球球 ⋅ 22分钟前 ⋅ 0

kibana启动异常

检查一下:kibana.yml 每一对key:value中,冒号之后应有空格。

增删改查1 ⋅ 24分钟前 ⋅ 0

js修改img的src属性刷新图片时的图片缓存问题

问题:上传一张图片,通过js更新src属性刷新图片使其即时显示时, 当img的src当前的url与上次地址无变化时(只更改图片,名称不变,不同图片名称相同)图片不变化(仍显示原来的图片) 但通过...

HaierBrother ⋅ 24分钟前 ⋅ 0

Mysql

1.Jdbc Url 设置allowMultiQueries为true和false mysql的批量更新是要我们主动去设置的, 就是在数据库的连接url上设置一下,加上* &allowMultiQueries=true *即可。 参数名称 参数说明 缺省...

瑟青豆 ⋅ 27分钟前 ⋅ 0

mysql导出导入表结构与数据

当我们需要进行数据迁移时,mysql自带的mysqldump会是最好的方式。 1.导出某张表的结构和数据 首先,我们应当使用服务器,打开终端,连接到所需要导出的表所在的服务器上。执行命令: mysqld...

hengbao5 ⋅ 28分钟前 ⋅ 0

世界杯也走向“比拼”大数据的时代

《日本经济新闻》6月19日报道称,俄罗斯足球世界杯已于6月14日揭开战幕。作为第21次举办的足球世界杯,如何活用大数据有可能成为决定各支球队胜负的重要因素。从对阵球队的分析到战术建议,还...

加米谷大数据 ⋅ 28分钟前 ⋅ 0

金额转为千分制,金额转中文大写

金额转关为大写 /** 数字金额大写转换(可以处理整数,小数,负数) */ function digitUppercase(n){ if(!n) reutrn "" let fraction = ['角', '分']; let digit = [...

YXMBetter ⋅ 31分钟前 ⋅ 0

开发利器JRebel部署SpringBoot项目

不要以为年纪轻轻就跌倒了人生谷底,未来还有更大的下降空间等着你。 idea下载和安装JRebel 激活JRebel 访问https://my.jrebel.com/ 使用facebook或twitter登录 勾选 Build project automati...

郑龙飞 ⋅ 36分钟前 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部