阅读更多

44顶
4踩

Web前端

原创新闻 50个实用的JavaScript工具

2009-02-20 12:11 by 副主编 zly06 评论(17) 有35119人浏览

 

JavaScript是一个功能强大的客户端脚本语言,许多现代化的网站和Web应用程序都会使用到它。JavaScript可以增强用户的体验,并提供丰富的互动式组件和功能。虽然它的语法相当简单,但是对开发者来说还是很有难度的,因为它要运行在Web浏览器中。

以下是我们为你推荐的50个相关工具:

JavaScript/AJAX编辑工具

  • jQuery UI
    jQuery UI是jquery官方推出的配合jquery使用的用户界面组件集合!包含了许多的界面操作功能,如我们常用的表格排序,拖拽,TAB选项卡,滚动条,相册浏览,日历控件,对话框等JS插件…



     

  • Google Web Toolkit
    Google 推出的一个开发Ajax 应用的框架,它支持用Java 开发和调试Ajax 应用。我们可以既充分利用Java语言的开发优势降低Ajax应用开发的难度,加快Ajax应用的开发速度,为Ajax的大规模应用创造可能,又可以充分发挥Ajax技术的优势,创建更加动态和交互性更好的Web应用程序,提升用户的浏览体验。
  • Jx
    是一个JavaScript库,用于创建MooTools框架顶部的图形用户界面,有许多例子以及API文档在这里 http://jxlib.org/。



     

  • Freestyle Webtop Toolkit
    可以帮你减少复杂性和时间的消耗,让你专注于编程逻辑和用户界面设计或其他的处理(跨浏览器的兼容和DHTML和Ajax的开发)。



     

  • Script#
    是一个Ajax和JavaScript编辑工具,可以让开发者用C#进行编写。还允许.NET开发人员充分的发挥已学的知识,同时还为.NET框架提供强大的工具。



     

  • Aptana Jaxer
    号称世界上第一个真正的Ajax服务器,由Aptana提供的一个最新产品。它使用Jaxer的服务端Java脚本API操作对象和数据库,支持FTP、SMTP、HTTP等常用协议。Jaxer集成了许多非常流行的JavaScript库,如 jQuery, DojoExt JS
  • JS Regex Generator
    JS Regex Generator可以帮助JavaScript开发人员编写与字符串文字想匹配的正则表达式。经常用来检验文本的格式,如输入的日期或电子邮件格式是否正确。



     

  • WaveMaker
    WaveMaker是一个Web应用程序WYSIWYG构建工具。它能够创建基于Dojo Ajax widget,Spring与Hibernate的应用程序。这里有 Demo Applications



     

文档工具

  • JSDoc Toolkit
    是一个把js描述格式化成文档的工具。开发者只需按JsDoc的规范写好注释就可以很方便导出文档。
  • jGrouseDoc
    是一个开源项目,它可以将开发者的code comments使用类似于Javadoc的格式进行管理。



     

 

JavaScript调试工具

  • Firebug
    它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体,是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀,从各个不同的角度剖析Web页面内部的细节层面,给Web开发者带来很大的便利。另外有一个Firebug lite版本,可以通过javascript调用,包含在页面中,从而在其他非Firefox浏览器中使用。



     

  • Venkman JavaScript Debugger
    基于Mozilla的浏览器(如firefox)的一个功能强大的JavaScript调试环境。提供了一系列有用的功能和选项,如代码分析或检查脚本的性能。



     

  • Drosera
    为Safari准备的一个很好的调试工具。



     

  • Opera Dragonfly
    Opera Dragonfly其实就是类似Firebug那样的网站/网路应用程式开发工具,可以调试JavaScript、检查CSS和DOM、查看错误,是网站开发人员的好工具,支持PC和移动电话。
  • NitobiBug
    这是一个基于浏览器的JavaScript对象记录和检查工具-类似的Firebug。可运行在不同的浏览器(的IE6 + , Safari浏览器,opera,火狐)提供一致的和强大的工具,丰富了Ajax应用程序。
  • DebugBar
    是一款Internet Explorer插件。它可以用于检查DOM,HTTP,Javascript及HTML代码合法性等 ...



     

  • Internet Explorer Developer Toolbar
    同样也是类似于Firebug,由微软发布。该产品让开发人员能够深入探索和理解Web页面,帮助开发者更好地创建Web应用。

JavaScript的测试和验证工具

  • Test - JavaScriptMVC
    一个JavaScriptMVC组件,可以轻松的为JavaScript代码创建自动化单元测试。它可以让你有效的测试DOM时间(如表单提交),从而减少开发时间。



     

  • JsUnit
    是一个流行的JavaScript单元测试框架,还有一个类似的支持Java的单元测试框架被称为JUnit。允许你编写测试案例并提供工具来自动执行代码。
  • JSLint
    是一个JavaScript验证工具,可以扫描JavaScript源代码来查找问题。一旦发现问题,JSLint就会显示描述这个问题的消息,并指出错误在源代码中的大致位置。



     

  • Crosscheck
    是一个开源的JavaScript测试框架,不在Web浏览器中也可以进行测试。
  • YUI Test
    它是由Yahoo! UI Library开发的一个JavaScriptMVC测试插件,能够让你模范大部分DOM动作,比如写,拖拽,比如模范AJAX响应,并且能够使用断言(assertions)。它能够象函数一样运行,并且能够在不同的console窗口进行集成测试。



     

  • J3Unit
    是JavaScript单元测试领域的新兵。这一特别的库所提供的超越于JSUnit的功能在于,它能直接与服务器端的测试套件(如 JUnit或Jetty)溶合。对JavaScript开发者来说,这可能是极其有用的,因为他们能够同时为他们的客户端和服务器端代码快速地遍历所有的测试用例。
  • Regular Expression Tool
    Regular Expression Tool是一个在线工具,可以用来测试你的正则表达式,使用这个工具很方便。



     

  • JavaScript Regular Expression Tester
    另一个脱离Web浏览器的正则表达式测试工具。



     

  • JSLitmus
    JSLitmus是一个轻量级的工具,用于javascript的性能测试



     

安全工具

  • AttackAPI
    AttackAPI是一个基于Web的攻击构造库,它可以结合PHP、JavaScript及其他客户端和服务器端技术进行使用。
  • jsfuzzer
    它是一个fuzzing工具,帮助你使用JavaScript编写/测试attack vectors。

新的替代JavaScript和Ajax的开发框架

  • Clean AJAX
    Clean一个开源的Ajax引擎,一组简化AJAX开发的高级接口。此处Clean还集成两个开源项目Google AJAXSLT:为Clean添加XSLT支持。Paul Johnstone(JavaScript实现MD5与SHA1算法的开源项目):为Clean添加对安全AJAX请求的支持。



     

  • SAJAX
    是一款被封装的ajax工具,非常方便与后台的交互,对XMLHttpRequest对象进行了封装,可以实现对服务器的异步请求,简化操作。



     

  • JavaScriptMVC
    JavaScriptMVC 是一个功能强大的 JavaScript framework. 也是一个很棒的JavaScript测试框架,它同样能提高开发的速度。JavaScriptMVC应用了模型-视图-控制器架构模式,把业务逻辑和表示分离,使得代码更加模块化。
  • qooxdoo
    是一个功能强大基于JavaScript GUI工包,它让你可以用JavaScript来开发类似于VB/Delphi风格的具有Ajax功能的web2.0应用程序。qooxdoo具有客户端浏览器检测功能,具有浏览器抽象层,可以无差别的创建跨浏览器的Web应用程序,它提供方便的调试接口,具有事件管理、聚焦管理、定时器、边框和对象属性等特征。它提供一组窗体组件并扩展了布局,它还提供跨平台的png图形透明支持功能。此外,qooxdoo提供一个原子组件,你可以在其基础上开发你自己的组件。



     

  • SimpleJS
    SimpleJS是一个简单,轻量的,但很特别的JavaScript框架。它提供了Ajax函数和动态效果。

图像处理

  • Reflection.js
    是一个能够给图片加倒影效果的JavaScript库。



     

  • typeface.js
    提供了一个字体的解决方案,你能使用任何字体显示,不管客户端是否安装了这种字体,即使不使用Flash(sIFR使用Flash)。
  • CanvasGraph.js
    它是一个简单的JavaScript库,让你使用HTML的canvas元素创造bar,line和pie。



     

  • flot
    Flot是Ole Laursen开发的基于JQuery的纯JavaScript实现的绘图库,Flot使用起来非常简单,绘图效果相当绚丽,而且还支持一些图片的操作功能。



     

  • JavaScript Diagram Builder
    是一个跨浏览器的javascript库,他可以帮助你创建坐标图或图表的,你只需要引用diagram.js在你的html头即可。



     

  • The Dojo Charting Engine
    创建数据的可视化组件。

实用的工具和JavaScript脚本

  • Processing.js
    Processing可视化语言移植至Javascript,这是Javascript成为Flash竞争对手的第一步。
  • AJAX Libraries API
    Google 把一些非常流行的JavaScript 框架放到Google 的服务器上。这样大家来说可以充分利用Google 的服务器资源。
  • DamnIT
    DamnIT是一个错误报告服务,它可以帮你追踪错误以及您Web应用程序的不足。
  • ie7-js
    是一个JavaScript库,解决IE与W3C标准的冲突的JS库。
  • Lazy loader
    是用javascript写的jquery插件,它可以延迟加载页面里面的图片。在用户浏览视界(页面中可见部分)以外的图片之前,它将不会被加载。

JavaScript代码优化和简化工具

  • JS Minifier
    一个基于Web的小工具,用来缩小你的JavaScript代码。



     

  • JSMIN
    JSMin 是一个javascript脚本压缩工具,首先去除脚本中不必要的注释以及空白字符,通常可以将js脚本压缩到原文件一半大小。
  • YUI Compressor
    是一款非常强大JS混淆和压缩工具,目前很多Javascript Framework都使用YUI Compressor进行代码分发。
  • Scriptalizer
    是一个有用的在线工具,减少HTTP请求。



     

  • ShrinkSafe
    文件压缩工具
  • SlickSpeed Selectors Test
    用于ajax框架css选择方法速度的对比。


 

 

  • 大小: 34.1 KB
  • 大小: 31.9 KB
  • 大小: 15.2 KB
  • 大小: 37.8 KB
  • 大小: 25 KB
  • 大小: 21.9 KB
  • 大小: 28.4 KB
  • 大小: 29.9 KB
  • 大小: 54.4 KB
  • 大小: 30.4 KB
  • 大小: 29 KB
  • 大小: 28.4 KB
  • 大小: 13.9 KB
  • 大小: 30.6 KB
  • 大小: 10.7 KB
  • 大小: 34.8 KB
  • 大小: 15.4 KB
  • 大小: 12.1 KB
  • 大小: 23.2 KB
  • 大小: 36.9 KB
  • 大小: 7.9 KB
  • 大小: 21.9 KB
  • 大小: 33.4 KB
  • 大小: 18.4 KB
  • 大小: 13.5 KB
  • 大小: 24 KB
  • 大小: 24.8 KB
44
4
评论 共 17 条 请登录后发表评论
17 楼 luogen33 2011-08-15 14:21
 
功能 很 牛 B
16 楼 spring1118 2010-09-29 16:05
wow~~~~楼主太强悍了!
谢谢分享这个好的一篇关于javascript工具的文章,收益匪浅啊~~~
15 楼 lcyangily 2010-04-01 12:57
highzhu 写道
jQuery 对于开发人员学习提高最好,extjs 那就算了,极其复杂的代码,开发人员看很费力,jQuery轻巧面而优雅,文件太大一下内存就会出问题,我们项目里我最怕刷树,以刷就有危险,风格看上去华丽,可以忽悠一下客户。我看到几个用extjs做的项目才他妈一个妈生的。左边是树,右这一个List界面。右边上面是若干个查询输入框。“企业级”气味浓厚。

看得出你是个傻X,EXT的定位不是一个js的辅助工具,而是一个富客户端的解决方案
14 楼 wcily123 2009-03-25 08:30
我在用JQUERY!
13 楼 lovefly_zero 2009-02-23 08:46
好多啊
12 楼 peacock 2009-02-22 22:14
highzhu 写道

jQuery 对于开发人员学习提高最好,extjs 那就算了,极其复杂的代码,开发人员看很费力,jQuery轻巧面而优雅,文件太大一下内存就会出问题,我们项目里我最怕刷树,以刷就有危险,风格看上去华丽,可以忽悠一下客户。我看到几个用extjs做的项目才他妈一个妈生的。左边是树,右这一个List界面。右边上面是若干个查询输入框。“企业级”气味浓厚。

你有正真用过ExtJS没有?!我所用过的JS框架,ExtJS的代码是最优美的,JQuery只是比较小罢了,但是对比2个东西得看功能和应用!
你用过的程序有几个不是统一Windows风格的?
搞清楚!JQuery是功能级的,只是基础构架,和界面无关,而ExtJS是应用级的,有自己的一套UI,但不带表ExtJS只有一套UI,只要你的CSS和JS够强,你可以定制自己的一套ExtJS UI,就像Windows程序并不限制大家只有一种风格一样!
另外,ExtJS完全可以抛弃UI,完全可以自己根据需求和功能来Build,也许这样和JQuery比较才算公平一点。

PS:虽然JQuery也有应用级的构架,叫做JQuery UI,但是还不成气候,和ExtJS比还不是一个等级。
11 楼 highzhu 2009-02-22 21:38
jQuery 对于开发人员学习提高最好,extjs 那就算了,极其复杂的代码,开发人员看很费力,jQuery轻巧面而优雅,文件太大一下内存就会出问题,我们项目里我最怕刷树,以刷就有危险,风格看上去华丽,可以忽悠一下客户。我看到几个用extjs做的项目才他妈一个妈生的。左边是树,右这一个List界面。右边上面是若干个查询输入框。“企业级”气味浓厚。
10 楼 wudasheng 2009-02-22 16:40
唉~
看咯半天
  点击进去看都是英文!!!!
9 楼 houlc 2009-02-22 09:22
怎么没有extjs呢?
8 楼 ccxw1983 2009-02-22 00:37
我还是比较喜欢jQuery,比较简捷、优雅,还有个非常人性化的文档。
7 楼 randy_jin 2009-02-21 22:39
Firebug不错,赞一个
6 楼 fuwang 2009-02-21 16:54
allenny 写道

面对这么多50,100之类的文章,我终于明白了,人生就是在不停的选择。选择对了,一帆风顺;选择错了,终生遗憾啊

选错框架和工具是小事。选了这个行业,才是最大的悲哀。
5 楼 rocy 2009-02-21 10:46
类似50个100个等等的总结不少,只有这篇介绍的实用
4 楼 whaosoft 2009-02-21 10:16
大家说下哪个最好使!!!!!!!??????????
3 楼 spacefly 2009-02-21 10:01
顶!!!!!
2 楼 aaxron 2009-02-21 08:48
llenny 2009-02-20 13:20 引用
面对这么多50,100之类的文章,我终于明白了,人生就是在不停的选择。选择对了,一帆风顺;选择错了,终生遗憾啊

真晕.
真能扯,
项目中该用什么就用什么.这些都是工具而已.
怎么用,关键还得看用的人.


1 楼 allenny 2009-02-20 13:20
面对这么多50,100之类的文章,我终于明白了,人生就是在不停的选择。选择对了,一帆风顺;选择错了,终生遗憾啊

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 用Cobertura测量测试覆盖率

    Cobertura是一种开源工具,它通过检测基本的代码,并观察在测试包运行时执行了哪些代码和没有执行哪些代码,来测量测试覆盖率。除了找出未测试到的代码并发现bug外,Cobertura还可以通过标记无用的、执行不到的代码...

  • WINDOWS键盘事件的挂钩监控原理及其应用技术

    WINDOWS键盘事件的挂钩监控原理及其应用技术     WINDOW的消息处理机制为了能在应用程序中监控系统的各种事件消息,提供了挂接 各种反调函数(HOOK)的功能。这种挂钩函数(HOOK)类似扩充中断驱动程序,挂钩上 可以挂接多个反调函数构成一个挂接函数链。系统产生的各种消息首先被送到各种 挂接函数,挂接函数根据各自的功能对消息进行监视、修改和控制等,然后交还控 制权或将消息传

  • 通过挂钩NtCreateSection监控可执行模块

      Normal 0 7.8 磅 0 2 false false false MicrosoftInternetExplorer4 <! /* Sty

  • 用 Cobertura 测量测试覆盖率

    NULL 博文链接:https://mwhgjava.iteye.com/blog/1297276

  • Cobertura计算覆盖率

    覆盖率计算|使用Cobertura|Defects4J数据集

  • 测试覆盖率之cobertura

    下面介绍现有的一种测试覆盖率报告方案:cobertura,具体是通过cobertura的maven以及Jenkins插件来实现测试覆盖率的展示。 maven部分 &lt;!-- 在clean时把老的ser文件也清理掉 --&gt; &lt;plugin&gt; &lt;...

  • 使用Cobertura统计单元测试覆盖率

    NULL 博文链接:https://terrencexu.iteye.com/blog/718834

  • Cobertura代码覆盖率测试工具介绍

    Cobertura代码覆盖率测试工具介绍文档,Cobertura代码覆盖率测试工具介绍

  • cobertura跑单元测试覆盖率为0问题解决

    cobertura跑单元测试覆盖率为0问题解决: 1.先确认cobertura:instrument阶段是成功的; 2.在pom文件&amp;父级pom文件中查找 两个plugin: maven-surefire-plugin: maven是个项目管理工具,如果我们不告诉它我们的...

  • Cobertura代码覆盖测试工具:cobertura-2.1.1

    Cobertura 是一种代码覆盖测试工具,它通过检测基本的代码,并观察在测试包运行时执行了哪些代码和没有执行哪些代码,来测量测试覆盖率。

  • Ant+JUnit+EMMA单元测试覆盖率

    EMMA,它是一个免费、开源的、用来衡量单元测试覆盖度的工具。三者结合,利用EMMA产生的测试覆盖度报考,可以一目了然的知道那部分代码已经被测试,哪部分没有,从而控制单元测试的质量。  EMMA,它是一个免费、...

  • 用 Cobertura 测量代码测试覆盖率

    示例build文件 博文链接:https://zhupan.iteye.com/blog/200878

  • cobertura和weblogic整合使用-代码覆盖率测试

    cobertura和weblogic整合使用-代码覆盖率测试 里面详细步骤和使用说明,并附加xml文件,不懂的可以QQ我,147806015,

  • cobertura-2.1.1测试案例覆盖率统计工具

    Cobertura是一个测试案例覆盖率统计工具,此资源下载后,解压,配置上环境变量即可使用

  • pycobertura:Cobertura报告的代码覆盖率差异工具

    它也旨在通过pycobertura diff命令来防止代码覆盖率降低:任何更改的行都应进行测试,并且未覆盖的更改应清晰可见,而不会让遗留的未覆盖代码成为pycobertura diff因此开发人员可以仅专注于其更改。 特征: 显示...

  • Cobertura单元测试覆盖率实例

    Cobertura 是一种开源工具,它通过检测基本的代码,并观察在测试包运行时执行了哪些代码和没有执行哪些代码,来测量测试覆盖率。除了找出未测试到的代码并发现 bug 外,Cobertura 还可以通过标记无用的、执行不到的...

  • Cobertura 统计多模块maven项目测试覆盖率

    而maven的模块是一个执行完再执行另一个,导致cobetura的代码覆盖率统计出现问题。 maven的项目结构是固定的,一个java模块生成一个target文件,各模块是隔离的,因此无法跨模块比对运行的测试类和源代码文件。这时...

  • 代码覆盖率与测试覆盖率你选哪个?

    这一些资料,对做【软件测试】的朋友而言应该是较为完整了,这类学习资料也陪伴我走过了最艰难的路程,希望也可以帮助到你!万事要尽早,尤其是技术行业,一定要提升技术功底。以上软件测试资料需要的可以私信我...

  • 1 (19).pptx

    商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板

  • 1 (8).pptx

    商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板商务风ppt模板

Global site tag (gtag.js) - Google Analytics