dojo代码编辑器（dojo教程）[20240420更新]

本篇文章给大家谈谈dojo代码编辑器，以及dojo教程对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、Dojo到底有什么好用的，一大堆需要引用的js文件，不臃肿吗！?
• 2、javascript用什么编辑器
• 3、谁告诉我 网站源码 用什么软件容易编辑 本人0基础
• 4、有哪些简单好用的 HTML 5 编辑器
• 5、dojo是什么？
• 6、如何使用Dojo的DatePicker控件制作联动日期选择器

Dojo到底有什么好用的，一大堆需要引用的js文件，不臃肿吗！?

你用的dojo都是老版本了， 现在都出1.10了， 在dojo1.8已后都已经采用了AMD模式， 做到了按需加载， 并dojo本身属于企业级应用的JS框架，为开发者提供大量UI、Tool、Ajax等类库，可以使开发者不用关注浏览器兼容性问题来开发系统。

本身dojo的JS编程方式比较OO， 深入学习后， 你会发现你可以通过dojo来定义属于自己的UI库、模块库等，还是比较爽的。

缺点就是对HTML的侵入性比较严重， 目前还没有看到MVVM的加入， 学习资料很少很难入门。

javascript用什么编辑器

目前前端使用率最高的就是sublime 和 webstorm了，当然了还有visual ，DW， 等等。下面仅介绍一些sublime和webstorm。

1.Sublime Text 是一个代码编辑器（Sublime Text 2是收费软件，但可以无限期试用），也是HTML和散文先进的文本编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来，它最初被设计为一个具有丰富扩展功能的Vim。

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。

2.WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。

功能编辑

JavaScript

· 基于DOM，特定浏览器完成

· 编码导航和用法查询

· 支持ECMAScript

· 支持CoffeeScript

· 支持结点

· JavaScript重构

· JavaScript单元测试

· 代码检测和快速修复

· JSLint/JSHint

· 基于 Mozilla的JavaScript调试器

其他用途

· 批量代码分析

· 编码语言混合或内混

· 拼写检查器

· 重复代码检测器

编辑语言

· 支持HTML5

· css/js

· 检验和快速修复

· Zen编码

· 显示内容

· 显示应用的风格

便捷的环境

· HTML5样本文件和其他Web应用程序模板

· FTP和远程文件同步

· 集成了版本控制系统

· 本地记录

优势功能编辑

智能的代码补全

支持不同浏览器的提示，还包括所有用户自定义的函数(项目中)

代码补全包含了所有流行的库，比如：JQuery, YUI, Dojo, Prototype, Mootools and Bindows。

代码格式化

代码不仅可以格式化，而且所有规则都可以自己来定义

html提示

大家经常在js代码中编写html代码，一般来说十分痛苦，不过有了智能提示，就爽多了。而且html里面还能有js提示。

联想查询

只需要按着Ctrl键点击函数或者变量等，就能直接跳转到定义；可以全

代码导航和用法查询 (8张)

项目查找函数或者变量，还可以查找使用并高亮。

代码重构

这个操作有些像Resharper，熟悉Resharper的用户应该上手很快，支持的有重命名、提取变量/函数、内联变量/函数、移动/复制、安全删除等等。

代码检查和快速修复

可以快速找到代码中的错误或者需要优化的地方，并给出修改意见，快速修复。

代码调试

支持代码调试，界面和IDEA相似，非常方便。

代码结构浏览

可以快速浏览和定位

代码折叠

功能虽小，不过胜在方便高效

包裹或者去掉外围代码

自动提示包裹或者去掉外围代码，一键搞定

谁告诉我 网站源码 用什么软件容易编辑 本人0基础

总结起来就是三剑客  dreamweaver网页制作排版+photoshop制作模板切片和美化图片+flash制作网页多元化的flash。不过现在市场上还有比较多的网站源码编辑软件或工具，主要有以下，可供参考：

1.Sublime Text

Sublime Text2是一款跨平台的编辑器，再也不用为换平台而找不到合适的、熟悉的编辑器担忧了。

Sublime Text2 是一款具有代码高亮、语法提示、自动完成且反应快速的编辑器软件，不仅具有华丽的界面，还支持插件扩展机制，用她来写代码，绝对是一种享受。

Sublime Text 2 的特色功能：

良好的扩展功能，官方称之为安装包(Package)。

右边没有滚动条，取而代之的是代码缩略图，这个功能非常赞

强大的快捷命令“可以实时搜索到相应的命令、选项、snippet 和 syntex， 按下回车就可以直接执行，减少了查找的麻烦。”

即时的文件切换。

随心所欲的跳转到任意文件的任意位置。

多重选择(Multi-Selection)功能允许在页面中同时存在多个光标。

支持 VIM 模式

支持宏，简单地说就是把操作录制下来或者自己编写命令，然后播放刚才录制的操作或者命令。

更新非常勤快

2.TopStyle5

TopStyle 是一款 CSS 开发辅助工具，即 HTML5 / CSS3 编辑器，它专注于 HTML CSS 设计辅助，提供比较多的功能，如 CSS 代码检查等，据称 TopStyle 的帮助文件非常好，有详细的 CSS 指令，适于初次接触 CSS 的学习之用。

不过如果你想对 CSS 了如指掌，对 CSS 网页布局非常熟练，还是扔掉一切辅助软件，用记事本开发，而熟练 CSS 之后，再使用此类辅助软件，可以提高工作效率和开发速度。

TopStyle 5 在 CSS3 / HTML5 方面的增强：

CSS3 for Inspector, Insight and Style Checker

Prefixr

CSS3 Media Queries

CSS Gradient Generator

Text Shadow Generator

Improved options for Preview Files (CSS-only)

HTML5 for Inspector and Insight

HTML5-only Validator

HTML Structure Panel

Wrap HTML Tag

Image Map Editor (HTML-only)

3.Chocolat

Chocolat是Mac系统上最新出现的一款强大的文本编辑器，兼具原生的Cocoa及强大的文本编辑功能。

Chocolat支持多种编程语言的关键字高亮显示、窗口分割、标签页、色彩主题等功能，界面和MacVim非常相似。

4.Aptana

Aptana 是一个非常强大,开源,专注于JavaScript的Ajax开发IDE。

它的特性包括：

JavaScript,JavaScript函数,HTML,CSS语言的Code Assist功能。

Outliner(大纲)：显示JavaScript,HTML和CSS的代码结构。

支持JavaScript，HTML，CSS代码提示，包括JavaScript 自定函数

代码语法错误提示。

支持Aptana UI自定义和扩展。

支持跨平台。

支持FTP/SFTP

调试JavaScript

支持流行AJAX框架的Code Assist功能：AFLAX，Dojo，JQuery，MochiKit，Prototype，Rico，script.aculo.us，Yahoo UI，Ext。

Adobe AIR与iPhone开发工具

5.KomodoIDE

Komodo 是一个跨平台支持多种程序语言的Integrated Development Environment （IDE）软件，目前他支持了在Windows与Linux上 ，Pythone, Ruby, Rails, Perl, HTML, CSS, and JavaScript,等的程序语言开发，以及多种程序语言语法着色。

6.Eclipse

Eclipse是著名的跨平台的自由集成开发环境（IDE）。最初主要用来Java语言开发，但是目前亦有人通过插件使其作为其他计算机语言比如C++和Python的开发工具。

Eclipse的本身只是一个框架平台，但是众多插件的支持使得Eclipse拥有其他功能相对固定的IDE软件很难具有的灵活性。许多软件开发商以Eclipse为框架开发自己的IDE。

Eclipse的基础是富客户机平台（Rich Client Platform, 即RCP）。RCP包括下列组件：

核心平台(启动Eclipse，运行插件）

OSGi（标准集束框架）

SWT（可移植构件工具包）

JFace（文件缓冲，文本处理，文本编辑器）

Eclipse工作台（即Workbench ，包含视图（views）、编辑器（editors）、视角（perspectives）、和向导（wizards））

Eclipse采用的技术是IBM公司开发的（SWT），这是一种基于Java的窗口组件，类似Java本身提供的AWT和Swing窗口组件；不过IBM声称SWT比其他Java窗口组件更有效率。Eclipse的用户界面还使用了GUI中间层JFace，从而简化了基于SWT的应用程序的构建。

Eclipse的插件机制是轻型软件组件化架构。在富客户机平台上，Eclipse使用插件来提供所有的附加功能，例如支持Java以外的其他语 言。 已有的分离的插件已经能够支持C/C++（CDT）、Perl、Ruby，Python、telnet和数据库开发。插件架构能够支持将任意的扩展加入到 现有环境中，例如配置管理，而决不仅仅限于支持各种编程语言。

Eclipse的设计思想是：一切皆插件。Eclipse核心很小，其它所有功能都以插件的形式附加于Eclipse核心之上。Eclipse基本内核包括：图形API (SWT/Jface)， Java开发环境插件(JDT )，插件开发环境(PDE)等。

Eclipse由各种不同的计划组成。以下列出了部分计划。

Eclipse计划：本身包括Eclipse平台，Eclipse富客户端平台（RCP）和Java开发工具（JDT）。

Eclipse测试和性能工具平台（TPTP）：提供一个允许软件开发者构建诸如测试调试、概况分析、基准评测等测试和性能工具的平台。

Eclipse Web工具平台计划 （WTP）：用Java企业版Web应用程序开发工具来扩展Eclipse平台。它由以下部分组成：HTML、JavaScript、CSS、JSP、SQL、XML、DTD、XSD和 WSDL的 源代码编辑器；XSD和WSDL的图形界面编辑器；Java企业版的“项目性质”（project nature）、建构器（builder）和模型（model），与一个Java企业版的导航（navigator）；一个Web服务（Web service）向导和浏览器，还有一个WS-I测试工具；最后是数据库访问查询的工具与模型。

Eclipse商业智能和报表工具计划（BIRT）：提供Web应用程序（特别是基于Java企业版的）的报表开发工具。

Eclipse可视化界面编辑器计划（VEP）：一个Eclipse下创建图形用户界面代码生成器的框架。

Eclipse建模框架（EMF）：依据使用XMI描述的建模规格，生成结构化数据模型的工具和其他应用程序的代码。

图形化编辑器框架（GEF）：能让开发者采用一个现成的应用程序模型来轻松地创建富图形化编辑器。

UML2：Eclipse平台下的一个UML 2.0元模型的实现，用以支持建模工具的开发。

AspectJ：一种针对Java的面向侧面语言扩展。

Eclipse通讯框架（ECF）：专注于在Eclipse平台上创建通讯应用程序的工作。

Eclipse数据工具平台计划（DTP）

Eclipse设备驱动软件开发计划（DSDP）

C/C++开发工具计划（CDT）：努力为Eclipse平台提供一个全功能C和C++的集成开发环境（IDE），它使用GCC作为编译器。

Eclipse平台COBOL集成开发环境子计划（COBOL）：将构建一个Eclipse平台上的全功能COBOL集成开发环境。

并行工具平台（PTP）：将开发一个对并行计算机架构下的一组工具进行集成的平行工具平台，而且这个平台是可移植的，可伸缩的并基于标准的。

嵌入式富客户端平台（eRCP）：计划将Eclipse富客户端平台扩展到嵌入式设备上。这个平台主要是一个富客户端平台（RCP）组件子集的集合。它能让桌面环境下的应用程序模型能够大致同样地能运用在嵌入式设备上。

有哪些简单好用的 HTML 5 编辑器

一、Adobe Edge

目前还处于预览阶段的Adobe Edge是用HTML5、CSS、JavaScript开发动态互动内容的设计工具。内容可以同时兼容移动设备和桌面电脑。Edge的一个重要功能是Web工具包界面，方便确保页面在不同浏览器中的架构一致性，此外Edge还将整合TypeKit这样的字体服务。

动画和图形可以添加到HTML元素中，程序也能通过Edge自身的代码片段库或者JavaScript代码进行扩展。动画可以在独立的时间线上进行嵌套，还能实现互动功能。符合可以服用并通过API和代码片段控制。通过Edge设计的内容可以兼容iOS和Android设备，也可以运行在火狐、Chrome、Safari和IE9等主流浏览器。

二、Adobe Dreamweaver CS6

Adobe Dreamweaver CS6作为一个Web设计软件，提供了对HTML网站和移动程序的可视化编辑界面。其Fluid Grid排版系统整合CSS样式表功能，提供自适应版面的跨平台兼容性。开发者可以完全实现Web设计的可视化操作，无需为代码所困。

用户不但还能在Live View中预览，还提供多屏幕预览功能。开发者可以通过MultiScreen预览面板查看HTML5内容的渲染效果。Live View通过WebKit渲染引擎支持HTML5。

三、Adobe ColdFusion 10

ColdFusion是用来开发企业Web程序的服务器端技术，通过Websockets、互动表单、视频和地理标签等HTML5技术创建富媒体用户体验。

四、Sencha Architect 2

在开发移动和桌面应用的工具中，Sencha的定位是HTML5可视化应用开发。开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发Sencha Touch2和Ext JS4 JavaScript应用，并实时预览。

五、Sencha Touch 2

Sencha Touch2是移动应用框架，也被看作是Sencha的HTML5平台。开发者可以用它开发面向iOS、Android和Blackberry、Kindle Fire等多种平台的移动应用。

六、Dojo Foundation Maqetta

来自于IBM的一个项目，Dojo Foundation Maqetta是为桌面和移动设备开发HTML5应用的开源工具，支持在浏览器中查看HTML5界面。用户体验设计师可以通过拖放组装UI样板

七、微软Visual Studio 2010 ServicePack 1

虽然一开始并不支持HTML5，但微软在2011年三月发布的Visual Studio 2010 SP1中提供了IntelliSense，追加了针对HTML5的一些元素。

八、JetBrains WebStorm 4.0

作为拥有HTML编辑器的JavaScript集成开发环境，WebStorm4.0提供了开发web应用的HTML5样板。开发者可以在创建HTML文档时可获得对HTML5文件的支持。例如砍伐者键入。开发者还可以在chrome浏览器中实时预览HTML文档。

九、Google Web Toolkit

该开发工具用于开发浏览器应用，但库中支持很多HTML5功能。包括对客户端或web存储的支持。其他HTML5功能还包括支持Canvas可视化，以及音频和视频widget。

dojo是什么？

1.dojo是一款javascript框架，提供很多javascript UI, 2. dojo的程序支持，正常来讲我们都是做web工程的时候用到，要用到dojo的源文件包，如果你javascript可以的话，可以直接参考里面的源码，对代码进行分析，如果只是用里面提供的UI类创建自己的DOM，这些可以很快上手。

3.配置dojo，原则上是只要能正确把 使用script src='[dojoroot]/dojo/dojo.js'放入你的web page 中 就可以。

我使用过java做web开发，是这样配置的，可以帮助理解下，我以tomcat容器为例，使用eclipse环境开发。首先放置 dojo包至你的web容器重 即 ，【tomcat root】/webapps 下，然后在eclipse中创建web app project，将你的web工程与你的web容器关联，这时候可以在你的index.jsp中使用dojo的东西做开发了，别忘记加 scriipt src = [dojoroot]/dojo/dojo.js至你的index.jsp中。使用dojo开发的细节，你要自己参考一下相关的东西了

如何使用Dojo的DatePicker控件制作联动日期选择器

在开发系统的调查功能时，需要设计一个可以联动的开始日期/结束日期选择器用来设定用户的调查的起始/结束日期。对于这个联动的日期选择器，我们的设计要求是这样的：

在新增调查时，该调查的开始日期默认为今天，而结束日期则不能选择成今天之前的日期；

当用户修改开始日期时，将判断当前用户设定的结束日期，如果结束日期在修改后的开始日期之后，则不修改结束日期，而如果结束日期变成了在修改后的开始日期之前时，则修改结束日期，和开始日期为同一天，并且设定用户不能选择开始日期之前的日期为结束日期；

修改结束日期时，不能选择开始日期之前的日期。

针对这样的要求，决定使用dojo的日期选择控件 DatePicker / DropDownDatePicker 来实现。

P_1167283844_0.JPG

最终的效果，联动的DatePicker，注意20日之前的日期都是不能选择的

针 对第1和第3点要求，dojo的 DatePicker / DropDownDatePicker 可以轻易的实现，可以通过设置 DatePicker / DropDownDatePicker 的 value 和startDate这两个属性实现。而要这个需求的难点在于两个DatePicker之间的联动，也就是说，要动态的根据第一个DatePicker的 值来设定第二个DatePicker的startDate属性。但是不幸的是，dojo没有提供直接的动态修改 DatePicker 的 startDate / endDate 的方法。虽然我们可以随时修改DatePicker的startDate属性，但是，在UI（日期选择界面）却不会发生变化，达不到我们想要的效果。

dojo提供了一个onValueChanged的事件，我们可以为第一个DatePicker添加这个事件的触发器，触发后调用我们自己写的 Javascript函数。而在这个函数里我们要解决的问题就只有修改第二个DatePicker的startDate属性（这个很简单），并让UI即时 生效（问题就在这里）了。

在仔细研究了dojo的DatePicker的源代码后发现，startDate仅仅是这个 DatePicker控件的一个单纯的属性，修改它并不会在内部触发任何改动UI的事件。所以，我们要做的就变得很简单了——想办法重绘UI就可以。不幸 中的万幸是，我们找到了_preInitUI()这个内部的方法，它可以绘制DatePicker的UI。

一切明朗后，就变得很简单了。看看代码片断吧，很轻松的实现了两个DatePicker / DropDownDatePicker控件的联动。

HTML4STRICT代码：

开始时间：input dojoType="dropdowndatepicker" id="startdate" name="start" value="today" displayFormat="yyyy-MM-dd" onValueChanged="checkEndDate" /

结束时间：input dojoType="dropdowndatepicker" id="enddate" name="end" displayFormat="yyyy-MM-dd" /

注意看上面HTML代码中的第一个DropDownDatePicker控件的属性：

value设置为today则会默认带出今天的日期

displayFormat设置时间显示格式（便于后台程序转换成timestamp导入DB）

onValueChanged则设置了触发名为checkEndDate的自定义Javascript函数

再看看Javascript代码片断：

JAVASCRIPT代码：

function g(id) {

return document.getElementById(id);

}

function w(id) {

return dojo.widget.getWidgetById(id);

}

function checkEndDate(){

var func=function(){

//得到新的修改后的开始日期和当前的结束日期

starttime=w('startdate').getDate();

endtime=w('enddate').getDate();

//开始日期是否在结束日期之后？

if (starttimeendtime) {

//开始日期在结束日期之后，修改结束日期等于开始日期

w('enddate').setDate(starttime); //时间戳

w('enddate').value=w('startdate').inputNode.value; //字符串值

}

//设定结束日期的startDate属性，限制用户选择开始日期之前的日期

var startDate=dojo.date.fromRfc3339(w('startdate').inputNode.value).setHours(0,0,0,0);

w('enddate').startDate=w('startdate').inputNode.value;

w('enddate').datePicker.startDate=startDate;

//得到结束日期的当前月份

var d = new Date(w('enddate').datePicker.curMonth);

//利用_preInitUI()重绘结束日期的UI（当前月）

w('enddate').datePicker._preInitUI(d,false,true);

}

//延时500毫秒执行

window.setTimeout(func,500);

}

怎 么样，很简单吧？不过你也许要问，为什么要延时500毫秒执行呢？原因是这样的，一开始浏览器在绘制页面的时候，设定开始日期为今天，这一动作同样会触发 onValueChanged事件。但这时候，因为结束日期的DatePicker控件还未被浏览器绘制完成，所以导致触发onValueChanged 事件后，Javascript无法执行成功，根本get不到enddate这个element。所以，我采取了onValueChanged事件触发后 500毫秒后执行Javascript程序，这时候，再慢的电脑都已经render完这个element了，执行Javascript就不会出错了，而且 对于用户，也没什么感觉。当然，你也可以写一个onLoad事件的Javascript函数在页面加载完成后再给startdate这个element赋 值。这都是问题的解决办法，怎么使用完全取决于你。

关于dojo代码编辑器和dojo教程的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。